vue + ElementUI 点击页面内按钮跳转，导航栏选中问题

最新推荐文章于 2025-06-19 08:00:54 发布

DenggLin

最新推荐文章于 2025-06-19 08:00:54 发布

阅读量3.4w

点赞数 2

CC 4.0 BY-SA版权

分类专栏： js

本文链接：https://blog.youkuaiyun.com/qq_34117170/article/details/80758575

js 专栏收录该内容

45 篇文章

订阅专栏

本文解决了Vue结合ElementUI项目中，使用按钮跳转页面时导航栏无法正确高亮显示的问题。通过计算属性动态设置激活菜单项，确保无论通过何种方式跳转，导航栏都能准确显示当前页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue + ElementUI 点击导航栏跳转页面是可以正常跳转高亮的，但通过页面内点击按钮跳转页面就会导致侧边栏不知道该选中那个了，下面说下解决方法

 <el-menu class="sidebar-el-menu"  :default-active="onRoutes" >
            </el-menu>

     computed:{
            onRoutes(){
                // this.$route.path
                // debugger
                if(this.$route.path.replace('/','')=='ProductEdit'){
                   return 'Product'; 
                }
                else if(this.$route.path.replace('/','')=='OrderDetail'){
                    return 'Order'
                }
                else{
                    return this.$route.path.replace('/','');
                }

            },
            }