当前位置: 首页 > news >正文

vue2 省市区联动组件封装

在element ui中有级联选择器el-cascader,其实已经够用了,但是在实际需求中,发现el-cascader如果有三级,数据数组必须得三个才能完全展示,所以不符合实际需求,还是自定义封装吧

需求:省市区联动数组,有多少个显示多少个

这里使用element ui得el-select组件,思路是使用监听

布局

  <el-selectref="selectProvinces"v-model="provinces.value"placeholder="请选择省":disabled="disableds.provinces"><el-optionv-for="province in provinces.children":key="province.value":label="province.label":value="province.value"></el-option></el-select><el-selectref="selectCitys"v-model="citys.value"placeholder="请选择市":disabled="disableds.citys":default-first-option="true"@change="changeCity"><el-optionv-for="city in citys.children":key="city.value":label="city.label":value="city.value"></el-option></el-select><el-selectref="selectAre
http://www.lryc.cn/news/283613.html

相关文章:

  • VScode远程开发
  • 芯片设计重要工具—— IBM LSF 分布式高性能计算调度平台
  • RDMA Scatter Gather List详解
  • 【动态规划】24子数组系列_最长湍流子数组_C++
  • fastJson和jackson的日期数据处理
  • 书生·浦语大模型实战营第五节课笔记及作业
  • 如何在CentOS 7 中基于OpenSSL 3.0 搭建Python 3.0 环境
  • 爬虫接口获取外汇数据(汇率,外汇储备,贸易顺差,美国CPI,M2,国债利率)
  • Spring Cloud和微服务架构的关系
  • C++:通过ofstream写入二进制文件内容
  • 系统配置dns主从服务器
  • 【git】解决网络连接问题
  • 限制API接口访问速率
  • 广东省第三届职业技能大赛“网络安全项目”B模块--数字取证解析
  • 全链路压力测试:现代软件工程中的重要性
  • 【计算机网络】难点、易遗忘点总结
  • 谷达冠楠科技:抖音开网店新手小白可以卖的产品
  • 爬虫案例—根据四大名著书名抓取并存储为文本文件
  • 阿里云容器服务助力万兴科技 AIGC 应用加速
  • STM32F103标准外设库——认识STM32(一)
  • 设计模式——1_5 享元(Flyweight)
  • kafka系列(二)
  • Ubuntu20.04安装配置OpenCV-Python库并首次执行读图
  • 经典目标检测YOLO系列(二)YOLOV2的复现(2)正样本的匹配、损失函数的实现及模型训练
  • 半波整流电路原理详解+参数与计算公式
  • GZ036 区块链技术应用赛项赛题第3套
  • LeetCode142.环形链表II
  • 触摸按键控制LED灯
  • QT自定义控件0-360°刻度尺
  • c语言0基础笔记