element ui cascader 动态加载回显问题

Question

问题：回显有时不成功有时成功，成功时会发送多发送市和区的请求，请求时间长的时候没有回显成功的几率较大

<el-form-item label="商户地址：" prop="arealist">
  <el-cascader
    clearable
    size="medium"
    v-model="formData.arealist"
    :props="areaPropsTwo"
    placeholder="请选择省/市/区"
    :disabled="isForbidden"
  ></el-cascader>
</el-form-item>

获取地址数据，这里是三个请求

areaPropsTwo: {
    lazy: true,
    lazyLoad (node, resolve) {
      const level = node.level
      if (level === 0) {
        getProvince().then(res => {
          const { status, data, message } = res
          if (status === 1) {
            const nodes = data.map(item => {
              return {
                value: item.code,
                label: item.name
              }
            })
            resolve(nodes)
          } else {
            this.$message.error(message)
          }
        })
      } else if (level === 1) {
        const selectData = node.data.value
        getCitys({provinceCode: selectData}).then(res => {
          const { status, data, message } = res
          if (status === 1) {
            const nodes = data.map(item => {
              return {
                value: item.code,
                label: item.name
              }
            })
            resolve(nodes)
          } else {
            this.$message.error(message)
          }
        })
      } else if (level === 2) {
        const selectData = node.data.value
        getCounty({cityCode: selectData}).then(res => {
          const { status, data, message } = res
          if (status === 1) {
            const nodes = data.map(item => {
              return {
                value: item.code,
                label: item.name,
                leaf: level >= 2
              }
            })
            resolve(nodes)
          } else {
            this.$message.error(message)
          }
        })
      }
    }
  }
};

回显的时是直接赋值的地区编码值 ，格式是 ["410000", "410100", "410105"]

this.formData.arealist = [
  resData.merProvince,
  resData.merCity,
  resData.merDistrict
];

Answer 1

请问这个问题解决了吗？

Answer 2

这个回显办法不可行，无法动态获取到数据.
而且，上面的动态加载，一般是同一个接口，也不能判断同级，当然不是说错，是无需这么繁琐.

Answer 3

同上问题，但是用的是级联异步加载，思考了一下，采用方法
1.设置一个初始值isAddressShow为true
<sq-cascader v-if="isAddressShow" v-model="airStationForm.address"></sq-cascader>
2.在自己异步请求之前，将值赋值为false

 this.isAddressShow = false

3.在异步请求数据完成后，生成地址数组后，将值赋值为true

this.airStationForm.address = ["410000", "410100", "410105"]
this.isAddressShow = true

问题点在于：

如果你异步请求时间过长，那么组件就会经历一段长时间隐藏

求：一个完美解决方案

Answer 4

前两级样式回显了，但最后一个有问题