antDesign vue 省市区级联,附json文件

1. 首先选择级联选择组件

 <a-cascader
              v-model="formData.orderCity"
              class="item-r2"
              :field-names="{
                label: 'label',
                value: 'label',
                children: 'children',
              }"
              :options="region1"
              placeholder="请选择"
            ></a-cascader>

2. 其中的绑定数据 option 数据来源region1 来自json文件,需要引入。但本json文件的键名与组件要求不一致,需要转换,所以才有field-names

import region1 from "../../../assets/json/region1.json";

3. 需要注意的时这个组件中被选中的value 值是数组类型,所以v-model 绑定一个数组,否则会报错。

4.json文件可在本人这里免费下载

猜你喜欢

转载自blog.csdn.net/zhuangjiajia09/article/details/122340419
今日推荐