31 数字化口腔修复技术 整本

zhongshujie

2 天以前 ce70bc450a2401997bb850f89f3c4dc0a23e0a72

 src/components/svgIcon/index.vue

@@ -3,12 +3,12 @@
  <i v-if="iconFileName.indexOf('el-icon-') === 0" :class="iconFileName" />

  <!-- 如果是 SVG 图标，进行改造 -->
  <svg v-else class="svg-icon" aria-hidden="true" v-on="$listeners" >
  <svg v-else class="svg-icon" aria-hidden="true" v-on="$listeners">
    <!-- 
      :xlink:href 动态绑定图标ID
      注意：这里假设你的图标ID是 "icon-" + iconFileName
    -->
    <use :xlink:href="`#icon-${iconFileName}`" />
    <use class="useBox" :xlink:href="`#icon-${iconFileName}`" />
  </svg>
</template>

@@ -26,18 +26,10 @@

<style scoped>
.svg-icon {
  /* 
    1. width 和 height 使用 em 单位，使其与 font-size 关联。
    2. overflow: hidden 防止图标在某些情况下溢出。
    3. vertical-align: 调整图标与文字的对齐基线。
    4. fill: currentColor; 告诉SVG内部所有没有指定fill的元素，
       统一使用当前元素的 'color' 值作为填充色。
  */
  width: 1em;
  height: 1em;
  overflow: hidden;
  vertical-align: -0.15em;
  fill: currentColor;
}

</style>