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

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

相关推荐
晴殇i2 分钟前
前端混合状态管理架构:Redux Toolkit + Zustand 协同设计、规范落地与性能优化
前端·openai
OpenTiny社区19 分钟前
GenUI SDK 生成式UI:六大开发特性详解,适配多种业务场景
前端·github·ai编程
大家的林语冰32 分钟前
TS 登顶第一语言;JS 最新 Temporal 时间减屎;Node 爆发反 AI 运动;CSS 将支持图片亮暗切换《前端周刊》
前端·javascript·css
Hilaku39 分钟前
OpenClaw 为什么突然不火了?
前端·javascript·程序员
精益数智工坊1 小时前
物料管理是什么?物料管理的具体工作有哪些?
大数据·前端·数据库·人工智能·精益工程
岩岩很哇塞!1 小时前
【vue实现模仿探探卡片滑动切换效果】
前端·javascript·vue.js
无我Code2 小时前
全套开源:一款云端服务+本地设备计算的文生图应用
前端·人工智能·后端
用户69371750013842 小时前
实测可用|小米 MiMo 百万亿 Token 免费领,开发者速冲
前端·后端·ai编程
前端小万2 小时前
令人头痛的前端环境
前端·前端工程化
明月_清风2 小时前
Nginx 模块机制深度解析:从核心原理到生产实践
前端·nginx