下面是该组件的使用数据的格式

options: [

 {

  value: 'zhejiang',

  label: 'Zhejiang',

  children: [

    {

      value: 'hangzhou',

      label: 'Hangzhou',

      children: [

        {

          value: 'xihu',

          label: 'West Lake',

        },

      ],

    },

  ],

},

],

https://github.com/airyland/china-area-data

数据来源于 此项目的v5版本

下面是文件的地址,city.json文件是对应此组件的

https://gitee.com/pphboy/citys

编写antd的Cascader 级联选择组件市级地区数据的更多相关文章

  1. Vue3学习（十五）之 级联选择组件Cascader的使用

    写在前面 好像又过去了一周,依旧是什么也没产出,不是懒,而是心情不好,什么也不想干,失眠是常事. 应该是从今年开始,突然感觉博客园就像是我自己的日记一样,承载着自己的喜怒哀乐和酸甜苦辣咸,当然,尴尬的 ...

  2. react 使用antd的TreeSelect树选择组件实现多个树选择循环

    需求说明,一个帐号角色可以设置管理多个项目的菜单权限 且菜单接口每次只能查询特定项目的菜单数据[无法查全部] 开发思路: 1,获取项目接口数组,得到项目数据 2,循环项目数据,以此为参数递归查询菜单数 ...

  3. element UI Cascader 级联选择器 编辑 修改 数组 路径 问题（转载）

    来源:https://segmentfault.com/a/1190000014827485 element UI的Cascader级联选择器编辑时 vue.js element-ui 2 eleme ...

  4. 编写antd配置表单组件

    编写antd配置表单组件 整体思路 抽取formitem的配置数组:包含组件类型.名称.label名称,相关的opts和扩展的opts,传递进入组件 组件通过Form.create()进行表单创建,能 ...

  5. ElementUI组件Cascader级联选择器数据后台处理

    Cascader级联选择器数据数据格式不知道的可以去官网看下:这里我就不表示什么了. 部门实体类: import lombok.Data; @Data public class Department ...

  6. vue+element ui项目总结点（一）select、Cascader级联选择器、encodeURI、decodeURI转码解码、mockjs用法、路由懒加载三种方式

    不多说上代码: <template> <div class="hello"> <h1>{{ msg }}</h1> <p> ...

  7. Cascader 级联选择器

    当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择. 基础用法 有两种触发子菜单的方式 只需为 Cascader 的options属性指定选项数组即可渲染出一个级联选择器. 通过expa ...

  8. element 的 Cascader 级联选择器设定默认值

    Cascader 级联选择器 发现在很多的CRM管理系统里面,都有不少页面是用到这种级联选择器的,确实,功能很实用, 不过要设置默认值则应该让不少人头痛,因为你选择的时候 @change 事件的参数就 ...

  9. .NET快速信息化系统开发框架 V3.2 -> Web 用户管理模块编辑界面-组织机构选择支持级联选择

    下拉框级联选择功能非常的实用,框架用户管理编辑界面对组织机构的选择在3.2版本中新增了级联选择的支持,让组织机构的选择更加的方便与高效,也不容易出错. 我们框架的组织机构结合实际分成了5种类型,分别为 ...

  10. 利用InfoPath实现SharePoint Server 2013列表的级联选择（Cascading Drop Down List）

    最近在利用SharePoint Server 2013的列表组织和存储数据,发现SharePoint列表原始不支持级联选择的功能. 谷歌百度一通以后,发现了很多通过代码实现的方案,利用第三方的插件sp ...

随机推荐

  1. perl大小写转换函数uc和lc

    $side = uc $attrs[0]; #把attrs[0]转换成大写,然后给side变量赋值. $gender = lc $attrs[1]; #把attrs[1]转换成小写,然后给gender ...

  2. 自学 TypeScript 第一天 环境开发配置 及 TS 基本类型声明

    前言:  自学第一天,什么是TS ,为什么要用 TS TS 全程 Typed JavaScript at Any Scale 解释起来就是 添加了类型系统的 JavaScript, 是 JavaScr ...

  3. vulnhub靶场之DEATHNOTE: 1

    准备: 攻击机:虚拟机kali.本机win10. 靶机:DEATHNOTE: 1,网段地址我这里设置的桥接,所以与本机电脑在同一网段,下载地址:https://download.vulnhub.com ...

  4. 面试官不按套路，竟然问我Java线程池是怎么统计线程空闲时间？

    背景介绍: 你刚从学校毕业后,到新公司实习,试用期又被毕业,然后你又不得不出来面试,好在面试的时候碰到个美女面试官! 面试官: 小伙子,我看你简历上写的项目中用到了线程池,你知道线程池是怎样实现复用线 ...

  5. Swing常用窗体

    Swing常用窗体 Swing 主要具有以下特点: ( 1 )轻量级组件. ( 2 )可插入外观组件. 窗体作为Swing的应用程序中组件的承载体,处于非常重要的地位.Swing中常用的窗体包括JFr ...

  6. Java实现递归查询树结构

    我们在实际开发中,肯定会用到树结构,如部门树.菜单树等等.Java后台利用递归思路进行构建树形结构数据,返回给前端,能以下拉菜单等形式进行展示.今天,咱们就来说说怎么样将List集合转换成TreeLi ...

  7. 数电第三周周结_by_yc

    主要内容:Modelsim和Quartus的使用坑点 Modelsim: 新建Project:   在每新建一个verilog文件时,均需要添加一project的独立路径,否则不同文件之间会相互影响! ...

  8. 跟我学Python图像处理丨带你入门OpenGL

    摘要:介绍Python和OpenGL的入门知识,包括安装.语法.基本图形绘制等. 本文分享自华为云社区<[Python图像处理] 二十七.OpenGL入门及绘制基本图形(一)>,作者:ea ...

  9. Linux开发板连接WPA加密的AP路由器

    Linux目前有两种方法配置网络: wireless-tools wpa_supplicant iw支持的驱动较多,但只支持WEP加密:wpa_supplicant有部分驱动支持不完善,但支持WEP. ...

  10. Kubernetes单机创建MySQL+Tomcat演示程序：《Kubernetes权威指南》第一章demo报错踩坑

    引言 最近做边缘计算项目,因为没有基础,所以首先学习Kubernetes.感觉系统的中文入门资料比较少,只找到<Kubernetes权威指南>(龚正.吴治辉等著,下称<指南>) ...