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

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

相关推荐
用户693717500138414 小时前
AI让编码变简单,真正拉开差距的是UI设计和产品思考
android·前端·人工智能
孟祥_成都14 小时前
别再吹牛了,100% Vibe Coding 存在无法自洽的逻辑漏洞!
前端·ai编程·vibecoding
ai超级个体15 小时前
别再吹牛了,100% Vibe Coding 存在无法自洽的逻辑漏洞!
前端·ai·ai编程·vibe coding
Mike_jia15 小时前
🎓 OpenMAIC 终极指南:清华开源的多智能体 AI 互动课堂平台
前端
踩着两条虫15 小时前
告别低代码“黑盒”!VTJ.PRO 2.0:用AI与自由重塑Vue3开发
前端·低代码·ai编程
OpenTiny社区15 小时前
WebAgent :基于 MCP 协议打造的智能应用“超级路由器”
前端·agent·mcp
dweizhao16 小时前
别再用 Figma 画线框图了,Google 这款免费工具直接出 UI 稿
前端
han_16 小时前
JavaScript设计模式(五):装饰者模式实现与应用
前端·javascript·设计模式
ProgramHelpOa16 小时前
Amazon SDE Intern OA 2026 最新复盘|70分钟两题 Medium-Hard
java·前端·javascript
smchaopiao16 小时前
如何用CSS和JS搞定全屏图片展示
前端·javascript·css