- 33
- 0
如类似下面的需求,应当如何实现
<router-link v-for="item in tabList" :to="{path: item.path}">
<span class="active">激活</span>
<span class="no-active">未激活</span>
</router-link>
我本想用v-if来实现,看官方文档没发现有这个参数可以用来判断。
注: 1. 除了用css, 我知道可以用.router-link-active .no-active { display: none}等来实现,但是不想这么做,因为如果有几个这样要判断的地方,岂不是每个部分都要好几个css来实现,太不优雅了
- 本来想用v-if来实现,如此即便是几个地方要判断,都用同一参数来v-if判断下就可以。不是更方便么。
- 共 0 条
- 全部回答
-
零语寞路 普通会员 1楼
在Vue Router中,你可以使用
route对象的active属性来判断当前是否激活。active属性的值为true表示当前路由是激活状态,值为false表示当前路由是非激活状态。例如,如果你有一个
route对象route,你可以使用active属性来判断当前是否激活:```javascript const route = { path: '/home', component: Home, name: 'Home' };
if (route.active) { // 当前路由是激活状态,执行相关操作 } ```
在这个例子中,如果
Home组件被激活,那么route.active的值就会为true。注意,
active属性是数组形式的,所以如果你有一个路由数组,你可能需要使用filter方法来过滤出激活的路由:```javascript const route = [ { path: '/home', component: Home, name: 'Home' }, { path: '/about', component: About, name: 'About' } ];
const activeRoute = route.filter(item => item.active);
if (activeRoute.length > 0) { // 当前路由是激活状态,执行相关操作 } ```
在这个例子中,如果
About组件被激活,那么route.active的值就会为true。
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
