a-menu 选中保存到浏览器

1.html

           <a-menu
                :defaultOpenKeys="['sub1','sub2','sub3','sub4','sub6','sub7','sub8',]"
                v-model="selectData"
                mode="inline"
                theme="light"
                @select="change"
              >
                <a-sub-menu key="sub1">
                  <span slot="title"
                    ><a-icon type="mail" /><span style="margin-left: 20%"
                      >体验展馆列表</span
                    ></span
                  >
                  <a-menu-item
                    key="10"
                    @click="goContent(11)"
                    style="padding-left: 33%"
                  >
                    体验展馆列表
                  </a-menu-item>
                </a-sub-menu>
                <a-sub-menu key="sub2">
                  <span slot="title"
                    ><a-icon type="appstore" /><span style="margin-left: 20%"
                      >区域管理</span
                    ></span
                  >
                  <a-menu-item
                    key="20"
                    @click="goContent(1)"
                    style="padding-left: 33%"
                  >
                    区域管理
                  </a-menu-item>
                </a-sub-menu>
            </a-menu>

defaultOpenKeys:：默认展开

v-model ：当前选中的菜单项 key 数组

@select ：被选中时调用

2.data()

 data() {
    return {
      openData: ["sub1"],
      selectData: [],
    };
  },

3.method 方法

    change(e) {
      this.selectData = e.key;
      console.log(e);
      sessionStorage.setItem("selectData", this.selectData);
    },

4.mounted() 生命周期

    if (sessionStorage.getItem("selectData") == null) {
      this.selectData = ["10"];
    } else {
      this.selectData.push(sessionStorage.getItem("selectData"))
    }

先判定如果没选择时候，设置默认值，否则取到存的数据放入数组中。