vue点击当前路由添加class怎么做？

vue-点击当前路由增加class,其他的删除class的方法

1. 路由 *** 作

<router-link

to='/list'

v-for='(item,index) in list'

:class='{active:index==idx}'

@click='btnClass(index)'

>

2. js部分

data () {

return {

idx:0,

list:["推荐",'社会','热点','汽车','科技','财经','军事','体育']

}

},

methods: {

btnClass: function(index) {

this.idx = index

}

} （BY三人行慕课）

1、取出非第一级的所有数据

2、映射出所有路由规则

3、添加路由

4、 登录成功后 保存菜单数据，保存后在vuex直接触发添加事件即可 this.commit('add_route')

用vue router如何获得当前页面的路由的方法如下：

路由器将自渲染对应的组件以及更新路由信息：

其中<router-view>可以传递props，支持v-ref,同时也可以使用v-transition和transition-mode来获得场景切换效果，被渲染的组件将注册到父级组件的this.$对象上。

路由对象和路由匹配：

路由对象，即$router会被注入每个组件中，可以利用它进行一些信息的获取。

如属性 说明：

$route.path 当前路由对象的路径，如'/vi

$route.query 请求参数，如/foo?user=1获取到query.user = 1

$route.router 所属路由器以及所属组件信息

$route.matched 数组，包含当前匹配的路径中所包含的所有片段所对应的配置参数对象。

$route.name 当前路径名字

当然，你也可以在自己定义路由规则（map)的时候自定义字段，用以特殊目的。

这里只是做了一些简单的介绍，最后，更多高级用法请参考官方文档。

---