feat: 封装获取图片主色调指令

src/directives/getImageMainColor.ts

@@ -0,0 +1,26 @@
+import { getImageMainColor } from '@/utils/tools';
+
+// 创建图片主色调指令
+const imageMainColorDirective = {
+  mounted(el: HTMLElement, binding: any) {
+    const imageUrl = binding.value;
+    
+    if (!imageUrl) return;
+    
+    getImageMainColor(imageUrl)
+      .then(color => {
+        el.style.backgroundColor = color;
+      })
+      .catch(error => {
+        console.error('获取图片主色调失败:', error);
+        // 设置默认背景色
+        el.style.backgroundColor = '#E6E6E8';
+      });
+  }
+};
+
+export default {
+  install(app: any) {
+    app.directive('image-main-color', imageMainColorDirective);
+  }
+};