使用element-ui的Clickoutside指令,解决点击其他div关闭自定义下拉树组件的下拉框


1)在组件中引入element-ui的Clickoutside指令
import Clickoutside from 'element-ui/src/utils/clickoutside'
2)在组件directives中写入指令Clickoutside
@Component({
name: 'search-slide',
directives: { Clickoutside },
})
3)页面中使用指令v-clickoutside,代码如下:
<div class="search_slide_input" v-clickoutside="handleClickOutside">
4)添加handleClickOutside方法:
// 点击下拉树之外的dom,隐藏下拉树弹框
handleClickOutside() {
this.showSlide = false;
}


免责声明!

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



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