element-ui 级联选择器 下拉框自动收起


背景:vue项目,使用的element-ui版本是2.13.2。使用element的 "Cascader 级联选择器" ,并且要求可以选择任意一级选项,即添加:props="{ checkStrictly: true }"

问题:选中文本时,下拉框不会自动回收

解决:cascader 有一个属性是dropDownVisible,可以用console调试发现。这个属性就是表示下拉框的隐藏(false)和打开(true).具体做法如下:

  1.添加ref属性

  

 

  2.添加如下代码【项目用的TS,所以写法如图片所示,如果是JS,就改成如下代码】

this.$refs.cascaderHandle.dropDownVisible = false;

  

   3.注意,如果同一个页面中有多个级联选择器,一定不要用同样的ref,ref的属性值的名称都不能相同。

注意:

1.在使用element-ui组件时,最好根据element的相应版本进行引入。例如,如果使用的版本是2.13.2,那就不用2.10.1。 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM