vue 3.0 下拉框联动效果

联动数据源

[
  {
    "name": "广州",
    "value": "广州",
    "child": [
      {
        "name": "天河",
        "value": "天河",
        "child": [
          {
            "name": "天河北",
            "value": "天河北"
          },
          {
            "name": "黄村",
            "value": "黄村"
          }
        ]
      },
      {
        "name": "番禺",
        "value": "番禺",
        "child": [
          {
            "name": "石楼",
            "value": "石楼"
          },
          {
            "name": "市桥东",
            "value": "市桥东"
          }
        ]
      }
    ]
  }
]

用法

main.js 引入组件库

import { createApp } from 'vue'
import App from './App.vue'

import 'vue3-select-linkage/lib/vue3-select-linkage.css'
import Vue3SelectLinkage from 'vue3-select-linkage'

createApp(App).use(Vue3SelectLinkage).mount('#app')

```javascript
```javascript
  <el-select
    :options="options"
    v-model:value="value"
    :fieldNames="fieldNames"
  />

参数说明

1、options 下拉数据源

2、value 默认选中值 数组格式

3、fieldNames 下拉数据源的key, value, child

javascript 用法

<template>
  <div>
    <div>子组件选择的值: {{ value }}</div>
    <VSelect
      :options="options"
      v-model:value="value"
      :fieldNames="fieldNames"
    />
  </div>
</template>

<script>
import { ref } from "vue";
const options = [
  {
    name: "广州",
    child: [
      {
        name: "天河",
        child: [
          {
            name: "天河北",
          },
          {
            name: "黄村",
          },
          {
            name: "东圃",
          },
          {
            name: "车陂",
          },
          {
            name: "岑村",
          },
          {
            name: "员村四横路",
          },
          {
            name: "科韵路",
          },
          {
            name: "棠下",
          },
          {
            name: "沙河",
          },
          {
            name: "员村二横路",
          },
          {
            name: "珠江新城东",
          },
          {
            name: "珠江新城中",
          },
          {
            name: "员村",
          },
          {
            name: "上社",
          },
          {
            name: "龙口东",
          },
          {
            name: "珠江新城西",
          },
          {
            name: "石牌桥",
          },
          {
            name: "龙口西",
          },
          {
            name: "龙洞",
          },
          {
            name: "东站",
          },
          {
            name: "体育中心",
          },
          {
            name: "东莞庄",
          },
          {
            name: "粤垦",
          },
          {
            name: "天河公园",
          },
          {
            name: "汇景新城社区",
          },
          {
            name: "天河南",
          },
          {
            name: "天河客运站",
          },
          {
            name: "天润路",
          },
          {
            name: "五山",
          },
          {
            name: "五山路口",
          },
          {
            name: "沙太南",
          },
          {
            name: "岗顶",
          },
          {
            name: "体育西",
          },
          {
            name: "燕塘",
          },
          {
            name: "华景新城社区",
          },
          {
            name: "长湴",
          },
        ],
      },
      {
        name: "番禺",
        child: [
          {
            name: "石楼",
          },
          {
            name: "市桥东",
          },
          {
            name: "顺德碧桂园社区",
          },
          {
            name: "石碁",
          },
          {
            name: "亚运城",
          },
          {
            name: "大石",
          },
          {
            name: "大学城",
          },
          {
            name: "华南",
          },
          {
            name: "广州雅居乐",
          },
          {
            name: "洛溪",
          },
          {
            name: "星河湾社区",
          },
          {
            name: "市桥南",
          },
          {
            name: "厦滘",
          },
          {
            name: "市桥北",
          },
          {
            name: "祈福",
          },
          {
            name: "市桥西",
          },
          {
            name: "祈福中区",
          },
          {
            name: "祈福新区",
          },
          {
            name: "金山谷",
          },
          {
            name: "华南碧桂园社区",
          },
          {
            name: "钟村",
          },
          {
            name: "南浦",
          },
          {
            name: "沙湾",
          },
        ],
      },
      {
        name: "海珠",
        child: [
          {
            name: "沥滘",
          },
          {
            name: "广州大道南",
          },
          {
            name: "南洲",
          },
          {
            name: "江南大道",
          },
          {
            name: "新港西",
          },
          {
            name: "昌岗路",
          },
          {
            name: "东晓南",
          },
          {
            name: "中大",
          },
          {
            name: "江南西",
          },
          {
            name: "宝岗",
          },
          {
            name: "下渡路",
          },
          {
            name: "赤岗",
          },
          {
            name: "江燕路",
          },
          {
            name: "客村",
          },
          {
            name: "工业大道北",
          },
          {
            name: "工业大道南",
          },
          {
            name: "滨江东",
          },
          {
            name: "滨江中",
          },
          {
            name: "滨江西",
          },
          {
            name: "前进路",
          },
          {
            name: "琶洲",
          },
          {
            name: "鹭江",
          },
        ],
      },
      {
        name: "白云",
        child: [
          {
            name: "金沙洲南",
          },
          {
            name: "白云大道北",
          },
          {
            name: "黄石",
          },
          {
            name: "广花路",
          },
          {
            name: "嘉禾望岗",
          },
          {
            name: "龙归",
          },
          {
            name: "同德围",
          },
          {
            name: "金沙洲北",
          },
          {
            name: "罗冲围",
          },
          {
            name: "人和",
          },
          {
            name: "南湖",
          },
          {
            name: "白云大道南",
          },
          {
            name: "三元里",
          },
          {
            name: "永泰",
          },
          {
            name: "新市",
          },
          {
            name: "石井",
          },
          {
            name: "黄边",
          },
          {
            name: "江夏",
          },
          {
            name: "机场路",
          },
          {
            name: "桂花岗",
          },
          {
            name: "京溪",
          },
          {
            name: "同和",
          },
          {
            name: "广园路",
          },
          {
            name: "梅花园",
          },
          {
            name: "广州大道北",
          },
        ],
      },
      {
        name: "越秀",
        child: [
          {
            name: "盘福路",
          },
          {
            name: "二沙岛",
          },
          {
            name: "黄花岗",
          },
          {
            name: "东山",
          },
          {
            name: "东川路",
          },
          {
            name: "东风东",
          },
          {
            name: "杨箕",
          },
          {
            name: "小北",
          },
          {
            name: "大沙头",
          },
          {
            name: "淘金",
          },
          {
            name: "西门口",
          },
          {
            name: "解放北",
          },
          {
            name: "五羊新城",
          },
          {
            name: "农讲所",
          },
          {
            name: "海珠广场",
          },
          {
            name: "北京路",
          },
          {
            name: "环市东",
          },
          {
            name: "解放南",
          },
          {
            name: "建设路",
          },
          {
            name: "共和路",
          },
          {
            name: "麓景路",
          },
          {
            name: "水荫路",
          },
        ],
      },
      {
        name: "花都",
        child: [
          {
            name: "山前大道",
          },
          {
            name: "美林湖",
          },
          {
            name: "铁路西",
          },
          {
            name: "旧区",
          },
          {
            name: "炭步",
          },
          {
            name: "狮岭",
          },
          {
            name: "镜湖大道",
          },
          {
            name: "新区",
          },
          {
            name: "花东",
          },
          {
            name: "建设北",
          },
          {
            name: "花山",
          },
        ],
      },
      {
        name: "增城",
        child: [
          {
            name: "永和",
          },
          {
            name: "挂绿新城",
          },
          {
            name: "荔城大道北",
          },
          {
            name: "增江",
          },
          {
            name: "新塘北",
          },
          {
            name: "石滩",
          },
          {
            name: "新塘南",
          },
          {
            name: "广园东",
          },
          {
            name: "荔城大道南",
          },
          {
            name: "凤凰城",
          },
          {
            name: "朱村",
          },
          {
            name: "中新",
          },
        ],
      },
      {
        name: "荔湾",
        child: [
          {
            name: "流花",
          },
          {
            name: "东风西",
          },
          {
            name: "黄岐",
          },
          {
            name: "黄沙",
          },
          {
            name: "环市西",
          },
          {
            name: "盐步",
          },
          {
            name: "西关",
          },
          {
            name: "西村",
          },
          {
            name: "坑口",
          },
          {
            name: "龙溪大道",
          },
          {
            name: "桥中",
          },
          {
            name: "窖口",
          },
          {
            name: "广钢新城",
          },
          {
            name: "中山八",
          },
          {
            name: "南岸路",
          },
          {
            name: "花地湾",
          },
          {
            name: "陈家祠",
          },
          {
            name: "芳村",
          },
        ],
      },
      {
        name: "黄埔",
        child: [
          {
            name: "萝岗",
          },
          {
            name: "文冲",
          },
          {
            name: "开发东区",
          },
          {
            name: "开发西区",
          },
          {
            name: "知识城",
          },
          {
            name: "大沙地",
          },
          {
            name: "开创大道",
          },
          {
            name: "丰乐路",
          },
        ],
      },
      {
        name: "南沙",
        child: [
          {
            name: "黄阁",
          },
          {
            name: "东涌",
          },
          {
            name: "金洲",
          },
          {
            name: "大岗",
          },
          {
            name: "蕉门河",
          },
          {
            name: "南沙湾",
          },
          {
            name: "明珠湾",
          },
        ],
      },
      {
        name: "从化",
        child: [
          {
            name: "鳌头",
          },
          {
            name: "温泉",
          },
          {
            name: "街口中心区",
          },
          {
            name: "太平",
          },
        ],
      },
      {
        name: "广州周边",
        child: [
          {
            name: "清远",
          },
          {
            name: "佛山",
          },
          {
            name: "中山",
          },
          {
            name: "其他",
          },
        ],
      },
    ],
  },
  {
    name: "清远",
    child: [
      {
        name: "清城区",
        child: [
          {
            name: "凤城街道",
          },
          {
            name: "东城街道",
          },
          {
            name: "洲心街道",
          },
          {
            name: "横荷街道",
          },
          {
            name: "源潭镇",
          },
          {
            name: "龙塘镇",
          },
          {
            name: "石角镇",
          },
          {
            name: "飞来峡镇",
          },
          {
            name: "清远市高新技术产业开发区",
          },
          {
            name: "清远市国营银盏林场",
          },
        ],
      },
      {
        name: "清新区",
        child: [
          {
            name: "太和镇",
          },
          {
            name: "太平镇",
          },
          {
            name: "山塘镇",
          },
          {
            name: "三坑镇",
          },
          {
            name: "龙颈镇",
          },
          {
            name: "禾云镇",
          },
          {
            name: "浸潭镇",
          },
          {
            name: "石潭镇",
          },
          {
            name: "笔架林场",
          },
        ],
      },
      {
        name: "佛冈县",
        child: [
          {
            name: "石角镇",
          },
          {
            name: "水头镇",
          },
          {
            name: "汤塘镇",
          },
          {
            name: "龙山镇",
          },
          {
            name: "高岗镇",
          },
          {
            name: "迳头镇",
          },
        ],
      },
      {
        name: "阳山县",
        child: [
          {
            name: "青莲镇",
          },
          {
            name: "江英镇",
          },
          {
            name: "杜步镇",
          },
          {
            name: "七拱镇",
          },
          {
            name: "太平镇",
          },
          {
            name: "杨梅镇",
          },
          {
            name: "大崀镇",
          },
          {
            name: "小江镇",
          },
          {
            name: "岭背镇",
          },
          {
            name: "黄坌镇",
          },
          {
            name: "黎埠镇",
          },
          {
            name: "阳城镇",
          },
          {
            name: "秤架瑶族乡",
          },
        ],
      },
      {
        name: "连山壮族瑶族自治县",
        child: [
          {
            name: "永和镇",
          },
          {
            name: "吉田镇",
          },
          {
            name: "太保镇",
          },
          {
            name: "禾洞镇",
          },
          {
            name: "福堂镇",
          },
          {
            name: "小三江镇",
          },
          {
            name: "上帅镇",
          },
          {
            name: "连山林场",
          },
          {
            name: "禾洞农林场",
          },
        ],
      },
      {
        name: "连南瑶族自治县",
        child: [
          {
            name: "三江镇",
          },
          {
            name: "大麦山镇",
          },
          {
            name: "寨岗镇",
          },
          {
            name: "三排镇",
          },
          {
            name: "涡水镇",
          },
          {
            name: "大坪镇",
          },
          {
            name: "香坪镇",
          },
        ],
      },
      {
        name: "英德市",
        child: [
          {
            name: "英城街道",
          },
          {
            name: "沙口镇",
          },
          {
            name: "望埠镇",
          },
          {
            name: "横石水镇",
          },
          {
            name: "桥头镇",
          },
          {
            name: "青塘镇",
          },
          {
            name: "白沙镇",
          },
          {
            name: "大站镇",
          },
          {
            name: "西牛镇",
          },
          {
            name: "九龙镇",
          },
          {
            name: "含光镇",
          },
          {
            name: "大湾镇",
          },
          {
            name: "石灰铺镇",
          },
          {
            name: "石牯塘镇",
          },
          {
            name: "下太镇",
          },
          {
            name: "波罗镇",
          },
          {
            name: "横石塘镇",
          },
          {
            name: "大洞镇",
          },
          {
            name: "连江口镇",
          },
          {
            name: "黎溪镇",
          },
          {
            name: "水边镇",
          },
          {
            name: "英红镇",
          },
          {
            name: "东华镇",
          },
          {
            name: "黄花镇",
          },
        ],
      },
      {
        name: "连州市",
        child: [
          {
            name: "连州镇",
          },
          {
            name: "星子镇",
          },
          {
            name: "大路边镇",
          },
          {
            name: "龙坪镇",
          },
          {
            name: "西岸镇",
          },
          {
            name: "保安镇",
          },
          {
            name: "丰阳镇",
          },
          {
            name: "东陂镇",
          },
          {
            name: "九陂镇",
          },
          {
            name: "西江镇",
          },
          {
            name: "瑶安瑶族乡",
          },
          {
            name: "三水瑶族乡",
          },
        ],
      },
    ],
  },
  {
    name: "江门",
    child: [
      {
        name: "台山市",
        child: [
          {
            name: "台城镇",
          },
          {
            name: "水步镇",
          },
          {
            name: "四九镇",
          },
          {
            name: "白沙镇",
          },
          {
            name: "三合镇",
          },
          {
            name: "冲蒌镇",
          },
          {
            name: "斗山镇",
          },
          {
            name: "都斛镇",
          },
          {
            name: "赤溪镇",
          },
          {
            name: "端芬镇",
          },
          {
            name: "广海镇",
          },
          {
            name: "海宴镇",
          },
          {
            name: "汶村镇",
          },
          {
            name: "深井镇",
          },
          {
            name: "北陡镇",
          },
          {
            name: "川岛镇",
          },
          {
            name: "大江镇",
          },
        ],
      },
      {
        name: "新会区",
        child: [
          {
            name: "今古州经济开发区",
          },
          {
            name: "大泽镇",
          },
          {
            name: "司前镇",
          },
          {
            name: "罗坑镇",
          },
          {
            name: "双水镇",
          },
          {
            name: "崖门镇",
          },
          {
            name: "沙堆镇",
          },
          {
            name: "古井镇",
          },
          {
            name: "三江镇",
          },
          {
            name: "睦洲镇",
          },
          {
            name: "小冈镇",
          },
          {
            name: "牛湾镇",
          },
          {
            name: "南坦镇",
          },
          {
            name: "七堡镇",
          },
          {
            name: "大鳌镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "鹤山市",
        child: [
          {
            name: "雅瑶镇",
          },
          {
            name: "桃源镇",
          },
          {
            name: "龙口镇",
          },
          {
            name: "古劳镇",
          },
          {
            name: "鹤城镇",
          },
          {
            name: "共和镇",
          },
          {
            name: "址山镇",
          },
          {
            name: "宅梧镇",
          },
          {
            name: "云乡镇",
          },
          {
            name: "双合镇",
          },
          {
            name: "合成镇",
          },
          {
            name: "江门监狱",
          },
          {
            name: "四堡林场",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "江海区",
        child: [
          {
            name: "外海镇",
          },
          {
            name: "礼乐镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "蓬江区",
        child: [
          {
            name: "潮连镇",
          },
          {
            name: "棠下镇",
          },
          {
            name: "荷塘镇",
          },
          {
            name: "杜阮镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "开平市",
        child: [
          {
            name: "沙塘镇",
          },
          {
            name: "苍城镇",
          },
          {
            name: "龙胜镇",
          },
          {
            name: "大沙镇",
          },
          {
            name: "马冈镇",
          },
          {
            name: "塘口镇",
          },
          {
            name: "赤坎镇",
          },
          {
            name: "百合镇",
          },
          {
            name: "蚬冈镇",
          },
          {
            name: "金鸡镇",
          },
          {
            name: "楼岗镇",
          },
          {
            name: "东山镇",
          },
          {
            name: "水井镇",
          },
          {
            name: "月山镇",
          },
          {
            name: "赤水镇",
          },
          {
            name: "水口镇",
          },
          {
            name: "翠山湖工业区",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "恩平市",
        child: [
          {
            name: "横陂镇",
          },
          {
            name: "圣堂镇",
          },
          {
            name: "良西镇",
          },
          {
            name: "沙湖镇",
          },
          {
            name: "牛江镇",
          },
          {
            name: "君堂镇",
          },
          {
            name: "大田镇",
          },
          {
            name: "那吉镇",
          },
          {
            name: "大槐镇",
          },
          {
            name: "东成镇",
          },
          {
            name: "城区",
          },
        ],
      },
    ],
  },
  {
    name: "韶关",
    child: [
      {
        name: "南雄市",
        child: [
          {
            name: "百顺镇",
          },
          {
            name: "邓坊镇",
          },
          {
            name: "湖口镇",
          },
          {
            name: "黄坑镇",
          },
          {
            name: "江头镇",
          },
          {
            name: "界址镇",
          },
          {
            name: "澜河镇",
          },
          {
            name: "帽子峰镇",
          },
          {
            name: "南亩镇",
          },
          {
            name: "水口镇",
          },
          {
            name: "坪田镇",
          },
          {
            name: "全安镇",
          },
          {
            name: "乌迳镇",
          },
          {
            name: "油山镇",
          },
          {
            name: "珠玑镇",
          },
          {
            name: "主田镇",
          },
          {
            name: "古市镇",
          },
          {
            name: "精细化工基地",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "乐昌市",
        child: [
          {
            name: "白石镇",
          },
          {
            name: "北乡镇",
          },
          {
            name: "大源镇",
          },
          {
            name: "黄圃镇",
          },
          {
            name: "九峰镇",
          },
          {
            name: "廊田镇",
          },
          {
            name: "两江镇",
          },
          {
            name: "梅花镇",
          },
          {
            name: "坪石镇",
          },
          {
            name: "庆云镇",
          },
          {
            name: "三溪镇",
          },
          {
            name: "沙坪镇",
          },
          {
            name: "五山镇",
          },
          {
            name: "秀水镇",
          },
          {
            name: "云岩镇",
          },
          {
            name: "长来镇",
          },
          {
            name: "河南镇",
          },
          {
            name: "乐城镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "仁化县",
        child: [
          {
            name: "城口镇",
          },
          {
            name: "大桥镇",
          },
          {
            name: "董塘镇",
          },
          {
            name: "扶溪镇",
          },
          {
            name: "红山镇",
          },
          {
            name: "黄坑镇",
          },
          {
            name: "石塘镇",
          },
          {
            name: "闻韶镇",
          },
          {
            name: "长江镇",
          },
          {
            name: "周田镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "始兴县",
        child: [
          {
            name: "隘子镇",
          },
          {
            name: "城南镇",
          },
          {
            name: "澄江镇",
          },
          {
            name: "顿岗镇",
          },
          {
            name: "罗坝镇",
          },
          {
            name: "马市镇",
          },
          {
            name: "深渡水瑶族乡",
          },
          {
            name: "沈所镇",
          },
          {
            name: "司前镇",
          },
          {
            name: "太平镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "翁源县",
        child: [
          {
            name: "坝仔镇",
          },
          {
            name: "官渡镇",
          },
          {
            name: "江尾镇",
          },
          {
            name: "龙仙镇",
          },
          {
            name: "翁城镇",
          },
          {
            name: "新江镇",
          },
          {
            name: "周陂镇",
          },
          {
            name: "铁龙林场",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "新丰县",
        child: [
          {
            name: "黄礤镇",
          },
          {
            name: "回龙镇",
          },
          {
            name: "马头镇",
          },
          {
            name: "梅坑镇",
          },
          {
            name: "沙田镇",
          },
          {
            name: "遥田镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "乳源瑶族自治县",
        child: [
          {
            name: "必背镇",
          },
          {
            name: "大布镇",
          },
          {
            name: "大桥镇",
          },
          {
            name: "东坪镇",
          },
          {
            name: "桂头镇",
          },
          {
            name: "洛阳镇",
          },
          {
            name: "乳城镇",
          },
          {
            name: "一六镇",
          },
          {
            name: "游溪镇",
          },
          {
            name: "天井山林场",
          },
          {
            name: "乳阳林业局",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "曲江区",
        child: [
          {
            name: "马坝镇",
          },
          {
            name: "樟市镇",
          },
          {
            name: "韶关冶炼厂",
          },
          {
            name: "沙溪镇",
          },
          {
            name: "韶关钢铁集团有限公司",
          },
          {
            name: "小坑镇",
          },
          {
            name: "乌石镇",
          },
          {
            name: "枫湾镇",
          },
          {
            name: "罗坑镇",
          },
          {
            name: "韶关十六冶金建设公司",
          },
          {
            name: "白土镇",
          },
          {
            name: "大塘镇",
          },
          {
            name: "韶关发电厂",
          },
          {
            name: "曲江区大宝山矿",
          },
        ],
      },
      {
        name: "武江区",
        child: [
          {
            name: "重阳镇",
          },
          {
            name: "西河片区",
          },
          {
            name: "江湾镇",
          },
          {
            name: "龙归镇",
          },
          {
            name: "沙洲尾",
          },
          {
            name: "西联镇",
          },
          {
            name: "沐溪工业园",
          },
        ],
      },
      {
        name: "浈江区",
        child: [
          {
            name: "东联片区",
          },
          {
            name: "东河片区",
          },
          {
            name: "犁市镇",
          },
          {
            name: "花坪镇",
          },
          {
            name: "乐园镇",
          },
          {
            name: "五里亭",
          },
          {
            name: "十里亭镇",
          },
          {
            name: "南郊片区",
          },
          {
            name: "城区",
          },
        ],
      },
    ],
  },
  {
    name: "河源",
    child: [
      {
        name: "和平县",
        child: [
          {
            name: "阳明镇",
          },
          {
            name: "彭寨镇",
          },
          {
            name: "东水镇",
          },
          {
            name: "林寨镇",
          },
          {
            name: "热水镇",
          },
          {
            name: "大坝镇",
          },
          {
            name: "上陵镇",
          },
          {
            name: "下车镇",
          },
          {
            name: "贝墩镇",
          },
          {
            name: "古寨镇",
          },
          {
            name: "礼士镇",
          },
          {
            name: "公白镇",
          },
          {
            name: "合水镇",
          },
          {
            name: "青州镇",
          },
          {
            name: "浰源镇",
          },
          {
            name: "优胜镇",
          },
          {
            name: "城区",
          },
          {
            name: "长塘镇",
          },
        ],
      },
      {
        name: "龙川县",
        child: [
          {
            name: "老隆镇",
          },
          {
            name: "四都镇",
          },
          {
            name: "黄石镇",
          },
          {
            name: "细坳镇",
          },
          {
            name: "车田镇",
          },
          {
            name: "贝岭镇",
          },
          {
            name: "黎咀镇",
          },
          {
            name: "上坪镇",
          },
          {
            name: "丰稔镇",
          },
          {
            name: "赤光镇",
          },
          {
            name: "龙母镇",
          },
          {
            name: "回龙镇",
          },
          {
            name: "铁场镇",
          },
          {
            name: "登云镇",
          },
          {
            name: "通衢镇",
          },
          {
            name: "鹤市镇",
          },
          {
            name: "黄布镇",
          },
          {
            name: "紫市镇",
          },
          {
            name: "佗城镇",
          },
          {
            name: "岩镇",
          },
          {
            name: "新田镇",
          },
          {
            name: "附城镇",
          },
          {
            name: "义都镇",
          },
          {
            name: "麻布岗镇",
          },
          {
            name: "城区",
          },
          {
            name: "田心镇",
          },
        ],
      },
      {
        name: "紫金县",
        child: [
          {
            name: "紫城镇",
          },
          {
            name: "附城镇",
          },
          {
            name: "九和镇",
          },
          {
            name: "上义镇",
          },
          {
            name: "蓝塘镇",
          },
          {
            name: "凤安镇",
          },
          {
            name: "义容镇",
          },
          {
            name: "古竹镇",
          },
          {
            name: "临江镇",
          },
          {
            name: "柏埔镇",
          },
          {
            name: "敬梓镇",
          },
          {
            name: "乌石镇",
          },
          {
            name: "水墩镇",
          },
          {
            name: "南岭镇",
          },
          {
            name: "苏区镇",
          },
          {
            name: "瓦溪镇",
          },
          {
            name: "好义镇",
          },
          {
            name: "中坝镇",
          },
          {
            name: "龙窝镇",
          },
          {
            name: "城区",
          },
          {
            name: "黄塘镇",
          },
        ],
      },
      {
        name: "连平县",
        child: [
          {
            name: "元善镇",
          },
          {
            name: "上坪镇",
          },
          {
            name: "内莞镇",
          },
          {
            name: "陂头镇",
          },
          {
            name: "溪山镇",
          },
          {
            name: "隆街镇",
          },
          {
            name: "田源镇",
          },
          {
            name: "油溪镇",
          },
          {
            name: "忠信镇",
          },
          {
            name: "高莞镇",
          },
          {
            name: "大湖镇",
          },
          {
            name: "三角镇",
          },
          {
            name: "绣缎镇",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "源城区",
        child: [
          {
            name: "源南镇",
          },
          {
            name: "埔前镇",
          },
          {
            name: "高新技术开发区",
          },
          {
            name: "城区",
          },
        ],
      },
      {
        name: "东源县",
        child: [
          {
            name: "城区",
          },
          {
            name: "仙塘镇",
          },
          {
            name: "灯塔镇",
          },
          {
            name: "骆湖镇",
          },
          {
            name: "船塘镇",
          },
          {
            name: "顺天镇",
          },
          {
            name: "上莞镇",
          },
          {
            name: "曾田镇",
          },
          {
            name: "柳城镇",
          },
          {
            name: "义合镇",
          },
          {
            name: "蓝口镇",
          },
          {
            name: "黄田镇",
          },
          {
            name: "叶潭镇",
          },
          {
            name: "黄村镇",
          },
          {
            name: "康禾镇",
          },
          {
            name: "锡场镇",
          },
          {
            name: "新港镇",
          },
          {
            name: "双江镇",
          },
          {
            name: "涧头镇",
          },
          {
            name: "半江镇",
          },
          {
            name: "漳溪镇",
          },
          {
            name: "新回龙镇",
          },
        ],
      },
    ],
  },
  {
    name: "赣州",
    child: [
      {
        name: "章贡",
        child: [
          {
            name: "章贡",
          },
        ],
      },
      {
        name: "章江新区",
        child: [
          {
            name: "章江新区",
          },
        ],
      },
      {
        name: "老城区",
        child: [
          {
            name: "老城区",
          },
        ],
      },
      {
        name: "开发区",
        child: [
          {
            name: "开发区",
          },
        ],
      },
      {
        name: "站北区",
        child: [
          {
            name: "站北区",
          },
        ],
      },
      {
        name: "水东区",
        child: [
          {
            name: "水东区",
          },
        ],
      },
      {
        name: "水西区",
        child: [
          {
            name: "水西区",
          },
        ],
      },
      {
        name: "南康",
        child: [
          {
            name: "南康",
          },
        ],
      },
      {
        name: "瑞金",
        child: [
          {
            name: "瑞金",
          },
        ],
      },
      {
        name: "赣县",
        child: [
          {
            name: "赣县",
          },
        ],
      },
      {
        name: "信丰",
        child: [
          {
            name: "信丰",
          },
        ],
      },
      {
        name: "宁都",
        child: [
          {
            name: "宁都",
          },
        ],
      },
      {
        name: "于都",
        child: [
          {
            name: "于都",
          },
        ],
      },
      {
        name: "大余",
        child: [
          {
            name: "大余",
          },
        ],
      },
      {
        name: "上犹",
        child: [
          {
            name: "上犹",
          },
        ],
      },
      {
        name: "崇义",
        child: [
          {
            name: "崇义",
          },
        ],
      },
      {
        name: "安远",
        child: [
          {
            name: "安远",
          },
        ],
      },
      {
        name: "定南",
        child: [
          {
            name: "定南",
          },
        ],
      },
      {
        name: "全南",
        child: [
          {
            name: "全南",
          },
        ],
      },
      {
        name: "兴国",
        child: [
          {
            name: "兴国",
          },
        ],
      },
      {
        name: "会昌",
        child: [
          {
            name: "会昌",
          },
        ],
      },
      {
        name: "寻乌",
        child: [
          {
            name: "寻乌",
          },
        ],
      },
      {
        name: "石城",
        child: [
          {
            name: "石城",
          },
        ],
      },
      {
        name: "龙南",
        child: [
          {
            name: "龙南",
          },
        ],
      },
    ],
  },
  {
    name: "景德镇",
    child: [
      {
        name: "珠山区",
        child: [
          {
            name: "珠山区",
          },
        ],
      },
      {
        name: "昌江区",
        child: [
          {
            name: "昌江区",
          },
        ],
      },
      {
        name: "乐平市",
        child: [
          {
            name: "乐平市",
          },
        ],
      },
      {
        name: "浮粱县",
        child: [
          {
            name: "浮粱县",
          },
        ],
      },
    ],
  },
];
export default {
  name: "App",
  components: {},
  setup() {
    const value = ref(["广州", "黄埔", "文冲"]);
    const fieldNames = {
      label: "name",
      value: "name",
      children: "child",
    };
    return {
      options,
      value,
      fieldNames,
    };
  },
};
</script>
```javascript

### typescript 用法
```javascript
<script lang="ts">
import { defineComponent, ref } from 'vue'
import VSelect from '~/VSelect/src/index.vue'

export default defineComponent({
  name: 'App',
  components: {
    VSelect
  },
  setup() {
    const value = ref<string[]>(['广州', '黄埔', '文冲'])
    const fieldNames = ref<{ [key: string]: string }>({
      label: 'name',
      value: 'name',
      children: 'child'
    })
    const options: ICascadeOptions[]
    return {
      options,
      value,
      fieldNames,
      spitFlag
    }
  }
})
</script>