监听点击空白处节点消失
const handleClickOutsideImg = (event) => {
const contextMenu = document.querySelector('.context-menu-Img');
if (contextMenu && !contextMenu.contains(event.target)) {
// 使用 map 方法创建新数组并更新
isImgMenuVisible.value = isImgMenuVisible.value.map(() => false);
}
};
// 监听多个按钮的点击事件
onMounted(() => {
window.addEventListener('click', handleClickOutsideText);
window.addEventListener('click', handleClickOutsideSign);
window.addEventListener('click', handleClickOutsideQr);
window.addEventListener('click', handleClickOutsideImg);
});
onUnmounted(() => {
// 卸载多个按钮的点击事件监听
window.removeEventListener('click', handleClickOutsideText);
window.removeEventListener('click', handleClickOutsideSign);
window.removeEventListener('click', handleClickOutsideQr);
window.removeEventListener('click', handleClickOutsideImg);
});
***canvas.toBlob适合转换成文件，返回一个blob对象 ，二进制数据 canvas.toDataUrl返回一个Dataurl字符串，适用于将图像之间嵌入html中，文本形式编码，占用空间相对更大
lodash中的debounce防抖 throttle节流 router.resolve用于解析路由，可以根据提供的路由信息生成一个包含路由相关信息的对象
