Date: Tue, 31 Mar 2026 16:05:19 +0800
Subject: [PATCH 2/2] 123
---
.../DepthCanvas/components/depth-header-tools.vue | 3 ++-
src/directives/clidk-besides.js | 12 +++++++++---
2 files changed, 11 insertions(+), 4 deletions(-)
diff --git a/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue b/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue
index 83c8bcd..11f25a7 100644
--- a/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue
+++ b/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue
@@ -20,8 +20,9 @@
v-if="v.child"
class="child"
v-show="v.showChild"
- :bind-id="v.name"
v-clidk-besides="() => (v.showChild = false)"
+ :bind-id="v.name"
+ :stop-besides="!v.showChild"
>
diff --git a/src/directives/clidk-besides.js b/src/directives/clidk-besides.js
index 503b4d5..c15dd24 100644
--- a/src/directives/clidk-besides.js
+++ b/src/directives/clidk-besides.js
@@ -1,16 +1,18 @@
// 点击外部区域触发事件
-// 用法:v-clidk-besides="() => {}"
// 说明:点击外部区域触发事件,不包括点击元素本身
-// 注意:点击元素本身或者属性bind-id相同元素不会触发事件
+// 用法:v-clidk-besides="() => {}"
+// 属性:bind-id,点击元素的id,用于判断是否点击了元素本身
+// 属性:stop-besides="true","true"时候点击不触发事件
export default {
name: 'clidk-besides',
mounted(el, binding) {
- console.log("mounted", el, binding);
const call = binding.value
const id = el.getAttribute("bind-id");
window.addEventListener("touchstart", fun, true);
window.addEventListener("mousedown", fun, true);
+ el.clidkBesidesFun = fun
function fun(e) {
+ if (el.getAttribute("stop-besides") == "true") return
var k = true;
iterator(e.target);
if (k) call && call();
@@ -24,4 +26,8 @@ export default {
}
}
},
+ unmounted(el) {
+ window.removeEventListener("touchstart", el.clidkBesidesFun, true);
+ window.removeEventListener("mousedown", el.clidkBesidesFun, true);
+ }
};
\ No newline at end of file