美文网首页
el-cascader组件选中节点后如何自动隐藏

el-cascader组件选中节点后如何自动隐藏

作者: 杨二哥 | 来源:发表于2023-08-27 14:42 被阅读0次

问题

在form表单中使用cascader,某些需求下会将整个表单disabled,如果此时点击了cascader,它会disabled,但弹出框不会消失。

查看文档

给cascader设置上ref

调用

// 清空选中的节点

this.$refs.cascader.$refs.panel.clearCheckedNodes();

// 设置为空可以让节点不高亮显示

this.$refs.cascader.$refs.panel.activePath = [];

上面的结果若不能没有解决问题。可能clearCheckedNodes有bug,去看看elementui原码。

找到原码并应用成功了:

let that = this;

if (that.$refs.cascader){

that.$refs.cascader.$refs.panel.clearCheckedNodes()

that.$refs.cascader.$refs.panel.activePath = []

that.$refs.cascader.$refs.panel.scrollIntoView()

that.$refs.cascader.$refs.input.$refs.input.setAttribute('aria-expanded', false)

that.$refs.cascader.$emit('visible-change', false)

that.$refs.cascader.$refs.panel.$emit('visible-change', false)

that.$refs.cascader.$refs.panel.$emit('close')

}

相关文章

网友评论

      本文标题:el-cascader组件选中节点后如何自动隐藏

      本文链接:https://www.haomeiwen.com/subject/ygrwmdtx.html