v-clickOutside

功能介绍

点击元素外部触发时事件

示例

点击盒子外部显示/隐藏

显示/隐藏

使用

<script setup lang="ts">
import { ref } from 'vue'

const visible = ref(true)
const handleClickOutside = () => visible.value = !visible.value
</script>

<template>
  <strong>点击显示/隐藏</strong>
  <div v-show="visible" v-clickOutside="handleClickOutside">点击外部: 显示/隐藏</div>
</template>