级联下拉框

代码：

<a-form-item label="所在地区：" name="dbTable">
						<a-cascader v-model:value="formData.dbTable" :options="options" placeholder="请选择所在地区" :loadData="loadData" :showSearch="false" @change="onChangeCascader"/>
					</a-form-item>
...
    const options = ref([])
const getProvinceData = ()=>{
        provincialApi.provinceData().then((res)=>{
             res.forEach((item)=>{
                let economizeInfo = {}
                economizeInfo.label = item.name
                economizeInfo.value = item.id
                economizeInfo.children = []
                economizeInfo.loading = false
                economizeInfo.isLeaf = false
                options.value.push(economizeInfo)
             })
        })
    }
    //市
    const loadData = (selectedOptions)=>{
        const targetOption = selectedOptions[selectedOptions.length - 1];
        targetOption.children = []
        let params = {
            id:targetOption.value
        }
        provincialApi.queryCityData(params).then((res)=>{
            res.forEach((item)=>{
                let marketInfo = {}
                marketInfo.label = item.name
                marketInfo.value = item.id
                targetOption.children.push(marketInfo)
            })
        })
    }
    //区
    const onChangeCascader = (value,selectedOptions)=>{
        if(value){
            const targetOptions = selectedOptions[selectedOptions.length - 1];
            targetOptions.children = []
            let params = {
                id:targetOptions.value
            }
            provincialApi.queryAreaData(params).then((res)=>{
                res.forEach((item)=>{
                    let areaInfo = {}
                    areaInfo.label = item.name
                    areaInfo.value = item.id
                    targetOptions.children.push(areaInfo)
                })
            })
        }
    }

效果：