antd vue 多个下拉 联动_使用antd+vue实现动态菜单栏，刷新过后仍然选中，含有二级分类自动展开...

image.png

1、在刷新后，保持菜单选中

这个比较简单

antd的API中提供了一个defaultSelectedKeys参数

在菜单标签中设置 defaultSelectedKeys属性指向this.$route.path即可完成

:defaultSelectedKeys="[$route.path]"

:selectedKeys="[$route.path]"

2、在刷新后如果当前选中的菜单是二级菜单则展开当前菜单的父菜单

这时需要用到两个API

openKeys 当前展开的 SubMenu 菜单项 key 数组

openChange 展开/关闭的回调

mode="inline"

style="height: 100%"

:defaultSelectedKeys="[$route.path]"

:selectedKeys="[$route.path]"

v-for="Menu in Menus"

:key="Menu.index"

:openKeys="openKeys"

@openChange="onOpenChange"

>

v-if="!Menu.children"

:key="Menu.key"

></