Vue3中点击元素容器外部关闭弹窗或悬浮框

<div
	class="float-card"
	v-if="item.isShowDropDown">
	<ShareUserBox />
</div>
 
const handleClickOutside = (event) => {
	const floatCardDom = document.querySelector('.float-card')
	if (
		floatCardDom &&
		!floatCardDom.contains(event.target)
		&& event.target?.title !== '共享'
	) {
		if(tableData.value.length && tableData.value.some(item => item.isShowDropDown)) {
			tableData.value = tableData.value.map(item => {
				return {
					...item,
					isShowDropDown: false
				}
			})
		}
	}
}
 
onMounted(() => {
	document.addEventListener('click', handleClickOutside)
})
 
onBeforeUnmount(() => {
	document.removeEventListener('click', handleClickOutside)
})