素材巴巴 > 程序开发 >

vue路由高亮的两种方式

程序开发 2023-09-15 21:22:28

vue路由高亮的两种方式

1.第一种使用mui
在这里插入图片描述
如果每一个tab中有mui-active这个类此时tab就会高亮,如果不写mui-active这个类的话,默认有router-link-active这个类,我们还需要自己在这个类中写高亮样式,已经有现成的高亮类mui-active,所以解决方法为:在路由中实现在这里插入图片描述

第二种方式:判断路径,如果此时在首页,首页的路径为/msite,判断是不是和当前路径相同,如果相同,则高亮类 guide-item 生效。
:class="{on: ‘/msite === $route.path’}"
在这里插入图片描述


标签:

上一篇: OneNote支持Markdown:高亮代码 下一篇:
素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。