elementui NavMenu导航菜单默认展开
近期项目用vue+element ui 做了一个新的后台管理系统 用到了菜单模块, 功能需要他刷新返回自动展开原本的导航列表,经过网上搜索发现 现有网上的博客都不能实现(可能是我自己的原因),经过摸索发现,默认展开导航需要两个关键属性default-openeds和default-active,官网上解释的当前激活菜单的 index 和 当前打开的 sub-menu 的 index 的数组,多的不
·
近期项目用vue+element ui 做了一个新的后台管理系统 用到了菜单模块, 功能需要他刷新返回自动展开原本的导航列表,经过网上搜索发现 现有网上的博客都不能实现(可能是我自己的原因),经过摸索发现,默认展开导航需要两个关键属性default-openeds和default-active,官网上解释的 当前激活菜单的 index 和 当前打开的 sub-menu 的 index 的数组,多的不哔哔了 上代码看就懂了
:default-openeds="defalut"中的defalut指的是['1-4']这种
<el-menu
:default-active="$route.path"
:default-openeds="defalut"
class="el-menu-vertical-demo"
@open="handleOpen"
@close="handleClose"
@select="selected"
background-color="#34495F"
active-background="#fff"
active-text-color="#000"
>
</el-menu>
<script>
let store = storage.getItem('active')
if(store){
this.activeDefault = store[0]
this.defalut.push(store[1])
console.log(this.defalut)
}
window.addEventListener('beforeunload',()=>{
storage.setItem('active',this.activeDefault)
console.log(this.defalut)
})
handleOpen(key, keyPath) {
this.activeDefault = keyPath;
console.log(key, keyPath);
},
</script>
刚发现只需要**:default-active="$route.path"** 这个属性就能实现了
更多推荐
已为社区贡献1条内容
所有评论(0)