vue3使用element-plus中的自定义指令 clickOutside解决点击外部自动收起的需求

vue3使用element-plus中的自定义指令 clickOutside解决点击外部自动收起的需求_第1张图片解决点击红色框框外面部分自动收起的需求

vue3.0中使用ClickOutside

1、从elemtn-plus中导入ClickOutside指令
import { ClickOutside as vClickOutside } from 'element-plus'

2、从元素上绑定对应的指令
v-click-outside= "onClickOutside"

3、onClickOutside绑定对应的方法

vue2.0
1、导入指令
import { ClickOutside } from 'element-plus'

2、映射该指令
directives:{

ClickOutside

}

3、在元素上绑定该指令
v-clickOutside="handleClickOutside"

4、在函数中调用该方法
function handleClickOutside(){}

你可能感兴趣的:(vue3使用element-plus中的自定义指令 clickOutside解决点击外部自动收起的需求)