ElementUI 级联选择器el-cascader启用选择任意一级选项,选中后关闭下拉框

1、启用选择任意一级选项

在 el-cascader 标签上加上配置项:

html 复制代码
 :props="{ checkStrictly: true }"

例如:

html 复制代码
<el-cascader
  ref="selectedArrRef"
  v-model="selectedArr"
  :options="optionsList"
  :props="{ checkStrictly: true }"
  @change="handleAreaChange"
/>

2、methods中添加方法

javascript 复制代码
handleAreaChange(e) {
	this.$refs.selectedArrRef.dropDownVisible = false
}

参考文档:Cascader 级联选择器

个人博客:紫琪软件工作室

相关推荐
We་ct4 分钟前
HTML5 原生拖拽 API 基础原理与核心机制
前端·javascript·html·api·html5·浏览器·拖拽
是上好佳佳佳呀9 分钟前
【前端(八)】CSS3 属性值笔记:渐变、自定义字体与字体图标
前端·笔记·css3
踩着两条虫20 分钟前
VTJ:核心引擎
前端·低代码·ai编程
GISer_Jing43 分钟前
AI时代前端开发者成长计划
前端·人工智能
方安乐44 分钟前
网页设计:自动适配浏览器深色/浅色模式
前端·html5
qq_12084093711 小时前
Three.js 工程向:后处理性能预算与多 Pass 链路优化
前端·javascript
南棱笑笑生1 小时前
20260422给万象奥科的开发板HD-RK3576-PI适配瑞芯微原厂的Buildroot时使用mpg123播放mp3音频
前端·javascript·音视频·rockchip
小小码农Come on1 小时前
QPainter双缓冲区实现一个简单画图软件
linux·服务器·前端
nunumaymax1 小时前
【第三章-react 应用(基于 react 脚手架)】
前端·react.js·前端框架
空中海1 小时前
第一章:Vue 基础与模板语法
前端·javascript·vue.js