<html>
<div ref="navDropdown">
<div class="nav">menu</div>
<div class="downmenu"></div>
</div>
</html>
<script>
import {ref, onMounted, onUnmounted} from 'vue';
const navDropdown = ref(null);
const vClickinside = (event: any) => {
const dropdownEl: any = navDropdown.value;
//console.log(dropdownEl, event.target);
if (!dropdownEl.contains(event.target)) {
console.log("out remove");
closeNav(); // 如果点击的是外部，关闭下拉菜单
}
};
const openDropdown = ()=>{
//...弹出层
}
const closeNav(){
//...关闭弹出
}
onMounted = ()=>{
document.addEventListener("click", vClickinside);
}
onUnmounted = ()=>{
document.removeEventListener("click", vClickinside);
}
</script>