业务背景
开发一个类似下拉框的弹出菜单,内容需要可编辑,可输入 (就是可以自定义了);
Dropdown
整个项目是基于Vue
开发的,引用了element-ui
库,所以直接使用了el-dropdown
组件来实现该功能
select
,点击select
弹出。 问题
因为菜单是多选的,肯定不能点击el-dropdown-item
就去关闭el-dropdown
,但页面上其他区域大多都给阻止元素冒泡了,所以插件本身的监听是否点击在el-dropdown
上的事件就无效了
那怎么才能够使用代码关闭el-dropdown
呢?
解决方案
看了好久的 ,提供的参数都没有控制el-dropdown
显隐的。
el-dropdown
显隐 然后解决方案就有了
...... 复制代码
在自己代码的事件控制中调用,就可以实现隐藏功能了
this.$refs.dropdown.visible = false;复制代码
想了解 可以点击这里,多多了解Vue
各种特性和开源组件的源码会对我们日常开发有很大的帮助,之前还想要是el-dropdown
实现不了就自己写一个这种组件呢 (┬_┬)