element中el-cascader级联 下拉选择-可单独多选(整理)

简介: element中el-cascader级联 下拉选择-可单独多选(整理)

效果图:


         

<el-cascader :options="regionsData" v-model="rankData.platform"
            :props="{value: 'id', label: 'name', children: 'child', multiple: true, checkStrictly: true }"
            collapse-tags></el-cascader>

备注:回显需要值

var newArr = []
var aa = [];
var bb = [];
// console.log(row, '262---------')
// console.log(row.area_list, '263---------')
for (var j = 0; j < row.bind.length; j++) {
  aa.push([row.bind[j].province_id,row.bind[j].city_id])
  bb.push([row.bind[j].province_id,row.bind[j].city_id,row.bind[j].area_id])
}
this.rankData.areaIdAll = [...aa,...bb];  //就处理成需要回显的数据了
相关文章
element el-cascader动态编辑赋值后,不回显的解决方法(整理)
element el-cascader动态编辑赋值后,不回显的解决方法(整理)
|
编解码
element-ui 表格滚动条(不同分辨率)自适应问题;
element-ui 表格滚动条(不同分辨率)自适应问题;
856 1
|
UED
element el-cascader动态加载数据 (多级联动,落地方案)
最近需要用到element ui的这个插件做地区的四级联动,但是碰了一些问题: 官网的说明太泛泛然,不易看懂 网上的教程乱七八糟,代码一堆一堆的 看这篇就对了!!!
2784 0
element el-cascader动态加载数据 (多级联动,落地方案)
|
JavaScript 数据格式
vue里使用elementui的级联选择器el-cascader进行懒加载的怎么实现数据回显?
vue里使用elementui的级联选择器el-cascader进行懒加载的怎么实现数据回显?
2433 0
vue里使用elementui的级联选择器el-cascader进行懒加载的怎么实现数据回显?
|
前端开发 JavaScript API
在 Vue3 + Element Plus 中生成动态表格,动态修改表格,多级表头,合并单元格
在 Vue 中,表格组件是使用频率及复杂度排名第一的组件,前端经常需要根据后台返回的数据动态渲染表格,比如动态表格如何生成,因为表格的列并不是固定的,在未知表格具体有哪些列的场景下,前端如何动态渲染表格数据。又或者需要把表格单元格进行合并处理,比如第一列是日期,需要把相同的日期进行合并,这样表格看起来会更加清晰。 本文手把手教你如何在 Vue3 + Element Plus 中创建表格、生成动态表格、创建动态多级表头、表格行合并、列合并等问题。如果你正在搭建后台管理工具,又不想处理前端问题,推荐使用卡拉云 ,卡拉云是新一代低代码开发工具,可一键接入常见数据库及 API ,无需懂前端,仅需拖拽即
3848 0
|
JSON JavaScript 定位技术
Echarts 绘制地图(中国、省市、区县),保姆级教程!
Echarts 绘制地图(中国、省市、区县),保姆级教程!
27421 154
|
JavaScript
Vue2级联选择(Cascader)
这是一个基于 Vue 3 的级联选择组件,支持多种自定义属性,如数据源、选中项、文本字段等。提供了丰富的配置项,如层级间隙、宽度、高度、禁用状态和占位符等,便于灵活使用。组件通过监听选择变化并触发回调事件,实现了动态更新与交互。
1041 1
Vue2级联选择(Cascader)
|
定位技术 API 数据格式
Element UI【详解】el-cascader 级联选择器 - 行政区划选择(可以选择任意一级),限定选择范围,获取并解析选中的节点
Element UI【详解】el-cascader 级联选择器 - 行政区划选择(可以选择任意一级),限定选择范围,获取并解析选中的节点
4268 0
|
前端开发 JavaScript 开发者
利用 el-select 和 el-tree 实现树形结构多选框联动功能
本文详细介绍了如何使用ElementUI中的el-select下拉选择器和el-tree树形控件来实现多功能联动选择器,包括多选、删除、搜索、清空选项等功能。通过树形控件展示复杂的层级结构,用户可以通过下拉选择树形节点,实时搜索节点,且支持批量选择和删除功能。文中提供了完整的HTML、JavaScript和CSS代码实现,帮助开发者快速集成此功能。
6407 0
利用 el-select 和 el-tree 实现树形结构多选框联动功能
echarts图例legend实现默认选中显示状态的解决方案
echarts图例legend实现默认选中显示状态的解决方案
1108 0

热门文章

最新文章