antd Dropdown动态加载数据

antd Dropdown组件动态加载数据，主要为在子菜单下循环添加，第一个sapn元素为固定的表头。先来看看模板写法，

 <a-dropdown>
        <span class="action ant-dropdown-link user-dropdown-menu">
          <a-avatar size="small" icon="user" />
          <span>{{ org.orgName }}</span>
        </span>
        <a-menu slot="overlay">
          <a-menu-item v-for="(item,index) in orgList" :key="item.orgId">
            <span @click="ChangeOrg(index)">{{ item.orgName }}</span>
          </a-menu-item>
          <a-menu-divider />
        </a-menu>
      </a-dropdown>

在看看数据原型：

  data() {
    return {
      org: {},
      orgList: {},
      
    }
  },
var org
org.orgId=12345;
org.orgName="亚洲分部";
orgList.push(org);

sapn元素中的click方法主要为实现点击切换的功能，实现如下：

  ChangeOrg(index) {
      let _this = this
      this.$confirm({
        title: '提示',
        content: '要切换组织?',
        onOk() {
          _this.org = _this.orgList[index]//第一行显示的组织
          _this.$store.state.org = _this.orgList[index]//将当前使用的存放到缓存中
          OperatorOrg.setUseOrg(_this.orgList[index])//这是一个方法，存放到localStorage中的
        },
      })
    },