Vue Element 导航子路由不选中问题

Posted zheroxh

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue Element 导航子路由不选中问题相关的知识,希望对你有一定的参考价值。

  • 首先说下遇到的问题
    • 1.进入嵌套路由,当前父导航无法高亮显示
    • 2.页面刷新后导航重置问题
    • 3.在嵌套路由刷新页面也会导致导航重置问题

  • 接下来是解决方案:
    elementUI 里面有个属性 default-active(当前激活菜单的 index)
<el-menu :default-active="activeIndex" @select="handleSelect" router></el-menu>

data () 
    return 
        activeIndex: '/'
    
,
watch: 
    '$route' () 
        this.handleSelect(this.activeIndex)
    
,
mounted () 
    this.activeIndex = this.$route.matched[0].path || '/'
,
methods: 
    handleSelect (index) 
        this.activeIndex = index
    
,

这样就OK了

## END

觉得有帮助的小伙伴点个赞支持下~

觉得有帮助的小伙伴点个赞~

以上是关于Vue Element 导航子路由不选中问题的主要内容,如果未能解决你的问题,请参考以下文章

elementUI的导航栏在刷新页面的时候选中状态消失的解决

Vue-ele实战登录页完善,主页由导航展示,路由动态跳转

elementui导航菜单通过路由跳转怎么活跃状态

vue+Element左树导航右内容区页面跳转

element-admin,首页为普通vue页面,不需要需要侧边栏和导航栏

vue Element动态设置el-menu导航当前选中项