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

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. MySQL数据库的性能分析 ---图书《软件性能测试分析与调优实践之路》-手稿节选

    1  .MySQL数据库的性能监控 1.1.如何查看MySQL数据库的连接数 连接数是指用户已经创建多少个连接,也就是MySQL中通过执行 SHOW  PROCESSLIST命令输出结果中运行着的线程 ...

  2. vue3 结合 element-plus 框架实现增删改查功能（不连接数据库）

    一.效果图 二.代码 2.1.导入依赖(已经安装过node.js) npm install element-plus --save 注意:要是安装失败,可以使用淘宝镜像进行下载,如下: 2.2.设置淘 ...

  3. Node.js的学习（二）node.js 模块化

    一.Node.js模块化 1.模块化概要 早期的javascript版本没有块级作用域.没有类.没有包.也没有模块,这样会带来一些问题,如复用.依赖.冲突.代码组织混乱等,随着前端的膨胀,模块化显得非 ...

  4. Java：String、StringBuilder、StringJoiner学习笔记

    String创建的俩种方式 1.直接赋值 String str = "Hello World!"; 当使用直接赋值的方式去创建字符串的时候,虚拟机会去串池里去检查字符串是否存在,如 ...

  5. Go语言核心36讲16----接口

    你好,我是郝林,今天我们来聊聊接口的相关内容. 前导内容:正确使用接口的基础知识 在Go语言的语境中,当我们在谈论"接口"的时候,一定指的是接口类型.因为接口类型与其他数据类型不同 ...

  6. openstack单机部署 未完成

    注:centos8单机版 注:本次实验手动配置密码均为admin 环境准备:配置hosts文件 192.168.116.85为本机IP echo '192.168.116.85 controller ...

  7. Training: Encodings I

    原题链接:http://www.wechall.net/challenge/training/encodings1/index.php 根据题目信息貌似是让我们用这个JPK来解码,我们先点击JPK去下 ...

  8. 【Java SE】Day11 final、权限、内部类、引用类型

    一.final关键字 1.概述 避免子类改写父类内容,使用final关键字,修饰不可变内容 可以修饰类(不可被继承).方法.变量(不能被重新赋值 ) 2.使用 (基本类型)被修饰的变量只能被赋值一次 ...

  9. 【云原生 • DevOps】一文掌握容器管理工具 Rancher

    一.容器管理工具 Rancher 介绍Rancher 是一个开源的企业级全栈化容器部署及管理平台,其实就是一个 Docker 的图形化管理界面.它为容器提供基础架构服务,可以让 CNI 兼容的网络服务 ...

  10. bug处理记录：com.fasterxml.jackson.core.JsonParseException: Illegal unquoted character ((CTRL-CHAR, code 9)): has to be escaped using backslash to be included in string value at [Source:

    1. 报错: com.fasterxml.jackson.core.JsonParseException: Illegal unquoted character ((CTRL-CHAR, code 9 ...