关于vue.js:antdesignvue使用menu选中菜单刷新之后默认展开和选中

1.开发环境 vue
2.电脑系统 windows10专业版
3.在应用ant-design-vue开发的过程中,咱们在应用到menu组件的时候,选中菜单的时候刷新之后,没有默认开展和选中,上面我来分享一下办法。
4.废话不多说,间接上操作:

// template<a-menu              :open-keys="openKeys" //要害代码              @openChange="onOpenChange" //要害代码              :default-selected-keys="defaultselectedkeys" //要害代码              :default-open-keys="defaultopenkeys" // 要害代码              mode="inline"              theme="dark"              :inline-collapsed="collapsed"              @click="ClickMenu" //要害代码            >              <template v-for="item in MenuList">                <a-menu-item v-if="!item.children" :key="item.code">                  <a-icon type="pie-chart" />                  <span>{{ item.name }}</span>                </a-menu-item>                <sub-menu v-else :key="item.code" :menu-info="item" />              </template>            </a-menu>

// returnrootSubmenuKeys: [], //所有路由数据(路由的name)    openKeys: [], // 选中示意父级列表 路由 name    defaultselectedkeys: [], // 默认选中 路由 name    defaultopenkeys: [], // 选中的菜单 id

// methodsClickMenu({    key}) {    // console.log(key);    this.defaultopenkeys[0] = "" + key;    this.defaultselectedkeys[0] = key;    //    sessionStorage.setItem(        "defaultopenkeys",        JSON.stringify(this.defaultopenkeys)    );    sessionStorage.setItem(        "defaultselectedkeys",        JSON.stringify(this.defaultselectedkeys[0])    );    this.$router.push({            name: key,        },        (onComplete) => {}    );},

onOpenChange(openKeys) {    // console.log(openKeys);    console.log(this.openKeys);    const latestOpenKey = openKeys.find(        (key) => this.openKeys.indexOf(key) === -1    );    if (this.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {        console.log(openKeys);        this.openKeys = openKeys;        sessionStorage.setItem("openKeys", JSON.stringify(this.openKeys));    } else {        console.log(openKeys);        this.openKeys = latestOpenKey ? [latestOpenKey] : [];        sessionStorage.setItem("openKeys", JSON.stringify(this.openKeys));    }},

5.成果如下:

//页面刷新之后,选中的状态不变

6.本期的分享到了这里就完结啦,心愿对你有所帮忙,让咱们一起致力走向巅峰。