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 级联选择器

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

相关推荐
哆啦A梦15881 小时前
Vue3魔法手册 作者 张天禹 012_路由_(一)
前端·typescript·vue3
RaidenLiu2 小时前
别再手写 MethodChannel 了:Flutter Pigeon 工程级实践与架构设计
前端·flutter·前端框架
~央千澈~3 小时前
抖音弹幕游戏开发之第17集:添加日志系统·优雅草云桧·卓伊凡
linux·服务器·前端
JamesYoung79713 小时前
第一部分 — 基础知识 项目框架与文件布局
前端·chrome
孟健3 小时前
程序员就业率暴跌27.5%:我离开大厂5个月后,看懂了这件事
前端
卸任3 小时前
Electron判断是内置摄像头还是接摄像头
前端·react.js·electron
NEXT064 小时前
普通函数与箭头函数的区别
前端·javascript·面试
全马必破三4 小时前
Webpack知识点汇总
前端·webpack·node.js
NEXT064 小时前
CommonJS 与 ES Modules的区别
前端·面试·node.js
猪头男4 小时前
【从零开始学习Vue|第八篇】深入组件——组件事件
前端