当我们需要制作一个类似顶部或底部导航栏的公共组件时,单击导航栏按钮跳转到另一个组件。
并更改导航栏按钮的样式。如果你用router-link跳转到=''router-link/,我们可以这样做。
更改路由器-链路-活动的样式,该样式由系统在路由路径指向当前组件时自动生成。
先看效果:
粘贴我的路线文件js
导出默认的新路由器({route: [{path3360'/',component3360app,children :[//次要路由{path3360 ' '),component3360 common _ nav,children:[ { path:'/html ',component:html },{ path:'/js ',component:js },{ path 3: '/CSS ',component:css)
当我们制作一个类似于选项卡或导航栏的公共底部组件,并单击到另一个组件的路线时,我们会更改当前路线的样式问题,并返回样式不会被初始化,因为它是由路线决定的
有一个非常好的方法,如果导航条全部被路由器链接覆盖。
路由器-链路-活动
-.router-link-active是当路由路径指向当前组件时自动生成的一个类,可以在此设置样式(选定状态)
以上vue路线变化时改变导航栏样式的方法,都是边肖分享的内容,希望能给大家一个参考和支持。