el-rate 自定义图标

1. 设计预览效果

2. 代码预览

          <el-rate
            v-model="item.value"
            :key="item.id"
            :icon-classes="['iconfont icon-rete-ac', 'iconfont icon-rete-ac', 'iconfont icon-rete-ac']"
            void-icon-class="iconfont icon-rete-noac"
          ></el-rate>

3. 设计思路

1.把切好的svg图生成为iconfont

2.引入iconfont，并修改组件代码。

4. 生成网站推荐

1. 阿里图标 www.iconfont.cn/ 下载的压缩包里面的文件

2. icomoon icomoon.io/app/#/selec… 下载的压缩包里面的文件，直接将压缩包文件夹引入即可

5. svg踩坑

直接下载图标引入代码后里面的星星不显示，需要把里面的星星镂空

6. 引入注意

1. 需要在main.js里引入 例如

   如果是icomoon import "@/assets/icomoon/style.css"

   如果是阿里下载的 import "@/assets/font/style.css"

2. 引入的时候需要在class加上名称 iconfont