iview menu导航菜单,子节点为选中状态自动展开Submenu

1,660 阅读1分钟

这里配合vue bus,当子菜单选中时手动展开submenu

<Menu 
    :theme="theme"
    width="auto"
    :active-name="activeMenu"
    :accordion="true"
>
    <div v-for="(v,i) in menus" :key="i">
        <MenuItem
            v-if="!v.children"
            :name="v.name"
            :to="v.path"
        >
            <Icon :custom="v.icon" size="20"/>
            {{v.val}}
            <b class="tig fr" v-if="v.msgNum">{{v.msgNum}}</b>
        </MenuItem>
        <p v-if="accoutype!='sales'&&i==3" class="line"></p>
        <p v-if="accoutype=='salesvp'&&i==6" class="line"></p>
        <p v-if='v.children' class="line"></p>
        <Submenu :name="v.name" v-if="v.children">
            <template slot="title">
                <Icon :custom="v.icon" />
                <span>{{v.val}}</span>
            </template>
            <MenuItem 
                ref="asideMenu"
                v-for="(item,index) in v.children"
                :key="index"
                @click.native="changeSelect(item)"
                :name="item.name"
                :to="item.path"
            >
                <Icon :type="item.icon" />
                {{item.val}}
            </MenuItem>
        </Submenu>
    </div>
</Menu>