From d41648827f2d21c7884ac8d00e8d8a9ac1cd2715 Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期一, 25 八月 2025 19:49:11 +0800
Subject: [PATCH] 组件优化
---
src/components/svgIcon/index.vue | 33 ++++-----------------------------
1 files changed, 4 insertions(+), 29 deletions(-)
diff --git a/src/components/svgIcon/index.vue b/src/components/svgIcon/index.vue
index 99040a1..92e0b8e 100644
--- a/src/components/svgIcon/index.vue
+++ b/src/components/svgIcon/index.vue
@@ -1,9 +1,9 @@
<template>
<!-- 濡傛灉鏄� Element UI 鍥炬爣锛屼繚鎸佷笉鍙� -->
<i v-if="iconFileName.indexOf('el-icon-') === 0" :class="iconFileName" />
-
+
<!-- 濡傛灉鏄� SVG 鍥炬爣锛岃繘琛屾敼閫� -->
- <svg v-else class="svg-icon" aria-hidden="true" v-on="$listeners" :style="svgStyle">
+ <svg v-else class="svg-icon" aria-hidden="true" v-on="$listeners" >
<!--
:xlink:href 鍔ㄦ�佺粦瀹氬浘鏍嘔D
娉ㄦ剰锛氳繖閲屽亣璁句綘鐨勫浘鏍嘔D鏄� "icon-" + iconFileName
@@ -20,39 +20,13 @@
type: String,
required: true
},
- // 鏂板涓�涓� color prop锛岀敤浜庢帴鏀堕鑹�
- color: {
- type: String,
- // 榛樿鍊艰涓� 'inherit'锛屽畠浼氱户鎵跨埗鍏冪礌鐨勬枃瀛楅鑹�
- default: 'inherit'
- },
- // 鍙�夛細澧炲姞灏哄鎺у埗
- size: {
- type: String,
- default: '1em'
- }
},
- computed: {
- // 浣跨敤璁＄畻灞炴�ф潵鍔ㄦ�佺敓鎴愭牱寮�
- svgStyle() {
- return {
- // 鍏抽敭鐐癸細灏嗕紶鍏ョ殑 color 鍊艰祴缁� CSS 鐨� 'color' 灞炴��
- color: this.color,
- // 鍏抽敭鐐癸細璁剧疆鍥炬爣灏哄
- fontSize: this.size,
- // 濡傛灉闇�瑕侊紝涔熷彲浠ュ湪杩欓噷璁剧疆瀹介珮锛屼絾鐢� font-size 鏇寸伒娲�
- // width: this.size,
- // height: this.size,
- };
- }
- }
}
</script>
<style scoped>
.svg-icon {
/*
- 鏍稿績榄旀硶锛�
1. width 鍜� height 浣跨敤 em 鍗曚綅锛屼娇鍏朵笌 font-size 鍏宠仈銆�
2. overflow: hidden 闃叉鍥炬爣鍦ㄦ煇浜涙儏鍐典笅婧㈠嚭銆�
3. vertical-align: 璋冩暣鍥炬爣涓庢枃瀛楃殑瀵归綈鍩虹嚎銆�
@@ -63,6 +37,7 @@
height: 1em;
overflow: hidden;
vertical-align: -0.15em;
- fill: currentColor;
+ fill: currentColor;
}
+
</style>
--
Gitblit v1.9.1