如何在vue项目中使用Element-ui Rate 哭脸笑脸评分组件的 icon-rate-face

新手在试水element-ui的评分组件Icon版(如下)时,ctrl cv之后页面是空白

如何在vue项目中使用Element-ui Rate 哭脸笑脸评分组件的 icon-rate-face_第1张图片

想来是缺少对应的iconfont

故把教程记下来,以帮助和我一样的vue新手

1. 首先下载字体文件

https://github.com/ElemeFE/element/tree/dev/examples/assets/styles/fonts

如何在vue项目中使用Element-ui Rate 哭脸笑脸评分组件的 icon-rate-face_第2张图片

2. 保存到vue项目src目录下/assets文件夹中

如何在vue项目中使用Element-ui Rate 哭脸笑脸评分组件的 icon-rate-face_第3张图片

3. 在main.js中引入

import '@/assets/fonts/style.css'

4. 结果 

 

可以正常使用了。

你可能感兴趣的:(element-ui)