关于javascript:iview-三级联动-Cascader出现第一次loaddata时候value值不立即生效

需要：每抉择一级都间接获取以后值（而且是动静加载子集合）

呈现问题：当第一次加载子集合时候，value 没有立刻变动。@on-change 事件也没有监听到变动。

例如：

代码监听：

回调办法：

加载子集合

解决办法：手动批改 value 值

全副代码：

<template>

  <Cascader :value="value"
            :data="data4"
            :load-data="loadData"
            change-on-select
            style="width:200px"
            @on-change='func_change'></Cascader>

</template>

<script>
import * as api from '@/api/client-crm'

export default {
  name: '',
  props: {
    value: {type: [Array],
      default: () => {return []
      }
    },
  },
  data () {
    return {
      loading: false,
      data4: [],}
  },
  created () {this.func_getCountries()
  },
  methods: {
    // 国家
    func_getCountries () {
      this.loading = true;
      api.getCountries().then(res => {console.log(res)
        if (res.code === 0) {let data = []
          res.result.forEach(element => {
            data.push({
              level: 1,
              id: element.id,
              value: element.country,
              label: element.country,
              children: [],
              loading: false
            })
          });
          this.data4 = data

          console.log(this.data4);
        }
      }).finally(() => {this.loading = false;})
    },
    // 省
    func_getProvinces (id) {
      this.loading = true;
      let params = {countryId: id}
      return api.getProvinces(params)

    },
    // 区
    func_getCities (id) {
      this.loading = true;
      let params = {provinceId: id}
      return api.getCities(params)
    },
    // 动静加载
    async loadData (item, callback) {
      item.loading = true;

      let data = []
      if (item.level === 1) {
        // 在加载时候，不会触发，func_change 办法，所以手动返回
        this.value[0] = item.value

        let res = await this.func_getProvinces(item.id)
        res.result.forEach(element => {
          data.push({
            level: 2,
            id: element.id,
            value: element.province,
            label: element.province,
            children: [],
            loading: false
          })
        });
      } else if (item.level === 2) {
        // 在加载时候，不会触发，func_change 办法，所以手动触发
        this.value[1] = item.value

        let res = await this.func_getCities(item.id)
        res.result.forEach(element => {
          data.push({
            level: 3,
            id: element.id,
            value: element.city,
            label: element.city
          })
        });
      }

      item.children = data
      item.loading = false;
      // 手动触发
      this.func_change(this.value)
      callback()},
    // 抉择变动
    func_change (val) {console.log('地区：', val);
      this.$emit('input', val)
    }
  }
}
</script>

<style scoped>
</style>