element ui菜单栏点击两次才高亮的bug

image.png
image.png

菜单栏无法高亮显示，添加了default-active="$route.path"属性后，只能保证刷新后当前菜单栏高亮，但是如果切换了路由参数后，通过this.route.push('/xxx')后双击菜单栏才能高亮，通过百度得知是因为default-active与index属性不一致导致的问题。
于是借鉴一个博主的经验，把default-active="$route.path"更改为一个计算属性"activeMenu"去控制

image.png

image.png

需要双击高亮的问题可以解决，但是还有个遗留的bug,通过this.$route.push(''/xxx'')后，首次切换菜单栏不默认高亮，最后借鉴了一个博主的方法
https://www.cnblogs.com/liuqin-always/p/11603708.html
利用route属性，同时为了保证index属性和的default-active属性一致，将路由的name属性设置给index和default-active，既可以完全解决这一问题，刷新后也会保持当前菜单栏高亮
image.png

image.png

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。