element|ElementUi中Cascader级联选择器回调问题解决 element|vue

ElementUi中Cascader级联选择器回调问题解决
1，在开发中使用了Cascader级联选择器，应用于省市联动的效果，发现问题：数据回调时不显示。
2，解决方法：使用ref进行回调处理。

this.$refs.cityShow.presentText ="复制"; // 首次手动复制

关键词是“presentText”
详细问题描述：
Cascader级联选择器中使用的是props进行的省市联动效果，而没有使用options 进行传值；
主要代码如下：

//data中props如下 props: { lazy: true, lazyLoad: (node, resolve) => { const { level, value } = node; if (level === 0) { this.getProvince(resolve); } else if (level === 1) { this.getCity(value, resolve) } } },方法如下： getProvince(resolve) { this.$http.getProvince((res) => { console.log("555", res) if(res.code === 0 && res.data && res.data.provinceArray) { const provinceList = res.data.provinceArray.map(item => ({ value: item, label: item.provinceName, leaf: false, })) resolve && resolve(provinceList) } }) }, getCity(data, resolve) { this.$http.getCity({ provinceId: data.provinceCode }, (res) => { if(res.code === 0 && res.data && res.data.cityArray) { const cityList = res.data.cityArray.map(item => ({ value: item, label: item.cityName, leaf: true, })) resolve && resolve(cityList) } console.log("666", res) }) },

【element|ElementUi中Cascader级联选择器回调问题解决】解决方案
在mounted中或者 watch处理

mounted() { setTimeout(()=>{ this.$refs.cityShow.presentText = this.companyInfo.provinceName +"/" + this.companyInfo.cityName; // 首次手动复制 this.$refs.areaShow.value = https://www.it610.com/article/this.companyInfo.regionName; },1000) },

watch:{ selectCity(arr){ //处理回显问题 setTimeout(()=>{ this.$refs.cityShow.presentText = arr[0].provinceName +"/" + arr[1].cityName; // 首次手动复制 },1000) } }, computed: { //工作地点回显问题 selectCity(){ return this.job.userAddress.selectedCity; }, }