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

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

相关推荐
岱宗夫up7 小时前
FastAPI入门(上篇):快速构建高性能Python Web API
开发语言·前端·python·fastapi
紫陌涵光8 小时前
112. 路径总和
java·前端·算法
漠月瑾-西安8 小时前
CVE-2025-55182漏洞解析:你的React项目安全吗?
前端·安全·react.js
No丶slovenly8 小时前
flutter笔记-输入框
前端·笔记·flutter
国产化创客8 小时前
ESP32+Web实现智能气象站
前端·物联网·智能家居·智能硬件
PD我是你的真爱粉9 小时前
Vue3核心语法回顾与Composition深入
前端框架·vue
coderYYY9 小时前
VSCode终端启动报错
前端·ide·vscode·npm·编辑器
tod11310 小时前
Redis 数据类型与 C++ 客户端实践指南(redis-plus-plus)
前端·c++·redis·bootstrap·html
Sylvia33.10 小时前
火星数据:棒球数据API
java·前端·人工智能
weixin1997010801610 小时前
1688商品详情页前端性能优化实战
前端·性能优化