onClickOutside是vueuse自带的方法
就是在元素外面点击,执行回调
import { onClickOutside } from '@vueuse/core'
import { ref } from 'vue';
// 格式:onClickOutside(dom元素,回调)
// 作用:当在 {dom元素} 之外点击,执行{回调}
const target = ref(null)
onClickOutside(target, () => {
close()
})
注解
clock() 是之前注册的点击关闭事件,这里面调用下就行
还有target 是在 dom元素身上注册个 ref='target' 事件
它的作用就是 在红框外面任意区域点击关闭