antd 级联选择动态加载 - 省市区地址选择

 

1、需要添加loadData属性，值是方法，如 :loadData="loadData"

<a-cascader :options="options"  :loadData="loadData" placeholder="请选择" :field-names="{ label: 'name', value: 'value', children: 'children' }" />

2、在created中获取省数据，注意： isLeaf属性需要添加，如果后面还有字节点，则设为false（才会加载loadData）, 没有则设为true

addressSelect({ type:'province' }).then( res => { // 获取省
 res.data.data.forEach(item => {
 item.value = item.province_code
 item.isLeaf = false
      })
 this.options = res.data.data
})

3、注：selectedOptions，要选择最后一项，因为最新的节点会在最后一个；处理完数据后要重新赋值，才会刷新

loadData(selectedOptions) {
 const targetOption = selectedOptions[selectedOptions.length - 1]
 targetOption.loading = true
 if (targetOption.city_code) { // 获取区
 addre