element-ui 级联选择器el-cascader动态加载

看过了el-cascade官方说明后，发现并不适用于我，也可以说这个例子不是太适合想要直接复制粘贴的我，于是乎，我将其改写成了可以直接复制粘贴的例子，具体代码如下：

<template>
  <el-cascader
    :props="cascaderProps"
    v-model="dataid"
    clearable>
  </el-cascader>
</template>

<script>
export default {
  name: "cascader",
  data() {
    return {
      dataid: [],
      cascaderProps: {
        lazy: true,
        lazyLoad: this.lazyLoad
      },
    }
  },
  methods: {
    lazyLoad(node, resolve) {
      // 获取当前是第几层
      let level = node.level

      let nodes = []
      // 我这边是两层，因此可根据是否有数据来做判断条件
      // 可改为根据不同层级判断
      if (!node.data) {
        nodes = [
          {
            value: 'beijing',
            label: '北京',
            leaf: level >= 1
          },
          {
            value: 'shanghai',
            label: '上海',
            leaf: level >= 1
          },
        ]
      } else {
        if (node.value === "beijing") {
          nodes = [
            {
              value: 'chaoyang',
              label: '朝阳区',
              leaf: level >= 1
            },
            {
              value: 'haidian',
              label: '海淀区',
              leaf: level >= 1
            },
          ]
        } else {
          nodes = [
            {
              value: 'pudong',
              label: '浦东新区',
              leaf: level >= 1
            },
            {
              value: 'hongkou',
              label: '虹口区',
              leaf: level >= 1
            },
          ]
        }
      }
      // 通过调用resolve将子节点数据返回，通知组件数据加载完成
      resolve(nodes)
    }
  }
}
</script>