初识Vue之Vue默认首页router激活一直存在

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了初识Vue之Vue默认首页router激活一直存在相关的知识,希望对你有一定的参考价值。

  在用vue-router实现nav导航栏样式切换时遇到了问题,一开始在实施切换的时候想到了vue方法里的watch监听路由改变用v-bind:class=“”,可这样会有一个问题就是在初始化页面的时候导航没有带样式,需要自己手动点击一下才能正常切换导航栏的样式,

  解决:<router-link>标签在页面中会被解析成一个<a>标签,在激活的时候a标签会被添加router-link-active的类名,所以在样式中给router-link-active的类名写切换样式就行了

      问题:在给router-link-active添加完样式后在发现默认路由样式一直存在。

  解决:给router-link添加exact属性

<router-link to="/" exact>首页</router-link>

以上是关于初识Vue之Vue默认首页router激活一直存在的主要内容,如果未能解决你的问题,请参考以下文章

Vue.js生态之vue-router

Vue Router 提供的标签组件

脚手架项目默认的首页index.html。以及App.vue组件中的router-view标签,默认是渲染的哪个组件?以及这个组件是可以在路由映射文件下配置的。

181vue-Router

Vue.js 生态之vue-router

Vue.js 生态之Vue-router 基础三