1、二级菜单name如果相同,选中二级菜单后,其他一级菜单中的二级菜单也会被选中,name要定义不同参数
{name: "android-yk", value: "一课"}
{name: "ios-yk", value: "一课"}
2、获取选中导航name值
iview自带on-select 和 on-open-change事件
3、动态生成open-names或active-name时不生效
运用Menu的updateopened方法:手动更新展开的子目录,注意要在 $nextTick 里调用。对openNames添加watch
<Sider
:style="{width: '140px','min-width': '207px','max-width': '207px',left: 0, overflow: 'auto',background: '#fff'}"
hide-trigger
>
<Row>
<Col span="8">
<Menu
:style="{width: '190px'}"
ref="side_menu"
accordion
:active-name="isShow"
@on-open-change="navParent"
@on-select="navChild"
:open-names="openNames"
>
<Submenu :name="item.name" v-for="(item,index) in this.navItems" :key="index">
<template slot="title">
<Icon :type="item.icon" />
{{item.value}}
</template>
<MenuItem
v-for="(item1) in item.childs"
:key="item1.index"
:name="item1.name"
>{{item1.value}}</MenuItem>
</Submenu>
</Menu>
</Col>
</Row>
</Sider>
watch: {
openNames() {
this.$nextTick(() => {
this.$refs.side_menu.updateOpened();
this.$refs.side_menu.updateActiveName();
});
}
},
网友评论