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

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

相关推荐
Moment12 分钟前
一周重写 Next.js?Cloudflare 和 AI 做到了😍😍😍
前端·javascript·后端
CodeSheep32 分钟前
同事去年绩效是C,提离职领导死活不让走,后来领导私下说他走了,就没人背这个绩效了
前端·后端·程序员
摸鱼的春哥1 小时前
春哥的Agent通关秘籍12:本地RAG实战(中下)向量化与落库
前端·javascript·后端
明月_清风1 小时前
毫秒级响应:前端本地搜索的“降维打击”
前端·indexeddb
摸鱼的春哥1 小时前
专家实验让AI做战争决策,AI的选择太暴力了
前端·javascript·后端
明月_清风1 小时前
存储配额:用 navigator.storage.estimate() 预判浏览器什么时候会删你的数据
前端·indexeddb
漂流瓶jz10 小时前
BEM、OOCSS、SMACSS、ITCSS、AMCSS、SUITCSS:CSS命名规范简介
前端·css·代码规范
陈随易13 小时前
真的,你可以不用TypeScript
前端·后端·程序员
郑州光合科技余经理14 小时前
代码展示:PHP搭建海外版外卖系统源码解析
java·开发语言·前端·后端·系统架构·uni-app·php
唐璜Taro15 小时前
Vue3 + TypeScript 后台管理系统完整方案
前端·javascript·typescript