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>