refactor: 优化copy指令事件处理和内存管理

src/directive/copy/copy.js

@@ -5,15 +5,11 @@ const copy = {
   inserted: function(el, binding) {
     // 创建复制图标元素
     const copyIcon = document.createElement('iconpark-icon')
-    
-    // const copyIcon = document.createElement('div')
-    // copyIcon.setAttribute('icon-class', 'copy')
     copyIcon.name='icon-fuzhi'
     copyIcon.style.cursor = 'pointer'
     copyIcon.style.marginLeft = '8px'
     copyIcon.style.fontSize = '16px'
     copyIcon.title = '点击复制'
-    copyIcon.innerHTML='<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><mask id="b" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="14" height="14"><path d="M14 0H0v14h14z" fill="#fff"/></mask><g mask="url(#b)" stroke="#267ef0" stroke-width=".875" stroke-linecap="round" stroke-linejoin="round"><path d="M9.333 7.525v2.45c0 2.042-.816 2.858-2.858 2.858h-2.45c-2.042 0-2.858-.816-2.858-2.858v-2.45c0-2.042.816-2.858 2.858-2.858h2.45c2.042 0 2.858.816 2.858 2.858"/><path d="M12.833 4.025v2.45c0 2.042-.816 2.858-2.858 2.858h-.642V7.525c0-2.042-.816-2.858-2.858-2.858H4.667v-.642c0-2.042.816-2.858 2.858-2.858h2.45c2.042 0 2.858.816 2.858 2.858"/></g></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h14v14H0z"/></clipPath></defs></svg>'
     
     // 设置元素的position为relative，确保图标的absolute定位正确
     if (getComputedStyle(el).position === 'static') {
@@ -24,7 +20,7 @@ const copy = {
     el.insertBefore(copyIcon, el.nextSibling)
     
     // 复制功能实现
-    copyIcon.addEventListener('click', async function(e) {
+    const clickHandler = async function(e) {
       // 阻止事件冒泡
       e.stopPropagation()
       try {
@@ -65,13 +61,17 @@ const copy = {
         console.error('复制失败:', error)
         Vue.prototype.$message.error('复制失败，请手动复制')
       }
-    })
+    }
+    
+    copyIcon.addEventListener('click', clickHandler)
+    // 存储事件处理器引用，以便在unbind时正确移除
+    copyIcon.__clickHandler = clickHandler
     
     // 存储图标引用，以便在组件卸载时清理
     el.__copyIcon = copyIcon
   },
   
- // 当指令与元素解绑时
+  // 当指令与元素解绑时
   unbind: function(el) {
     // 清理事件监听器和元素
     if (el.__copyIcon) {
@@ -100,4 +100,4 @@ const copy = {
   }
 }
 
-export default copy
+export default copy
\ No newline at end of file