element ui 级联选择器选择最后一节点关闭下拉框

最新推荐文章于 2025-03-07 21:39:52 发布

原来我认识你

最新推荐文章于 2025-03-07 21:39:52 发布

阅读量1.7k

点赞数 4

分类专栏： elementui 文章标签： elementui vue.js

本文链接：https://blog.csdn.net/Qyzcxy/article/details/122986901

版权

elementui 专栏收录该内容

4 篇文章

订阅专栏

博客介绍了在Vue应用中使用Element UI的Cascader组件时，如何配置props以确保在选择最后一级节点后自动关闭下拉框。通过设置`checkStrictly`为`true`，并结合`handleChange`方法判断是否为最后一级节点，实现下拉框的自动关闭功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

官网自带的选择最后一节点不会关闭下拉框的

修改如下：props里一定要加上这个参数 checkStrictly:true

<el-cascader
    ref="cascaders"
    :options="options"
    :props="{ checkStrictly: true }"
     clearable
    @change="handleChange"
>
</el-cascader>


methods:{

    handleChange() {
      const obj = this.$refs["cascaders"].getCheckedNodes();
      // 判断是否是最后一级
      !obj[0].hasChildren&&
      this.$refs.cascaders.toggleDropDownVisible();
    },
}

有不正确的地方，欢迎指出。