Elementui cascader组件如何取消选中 clearCheckedNodes

Elementui cascader组件如何取消选中 clearCheckedNodes

 

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

查看文档


给cascader设置上ref
<el-cascader v-model.trim ="cId" ref="cascader" :options="category" @change="handleChange"></el-cascader>
调用

// 清空选中的节点
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')
}
解决问题:编辑表单回显情况!以上内容仅供参考。。。

 

————————————————
版权声明:本文为CSDN博主「onlylele」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/onlylele/article/details/109026886

posted @ 2022-03-29 15:35  前端白雪  阅读(880)  评论(0编辑  收藏  举报