vue引入Vue-Awesome

转载于 2017-08-30 10:26:00 发布 · 546 阅读

·

1

·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wangyunhui/p/7451831.html

文章标签：

#javascript #ViewUI

本文介绍如何在Vue项目中使用Vue-Awesome来集成FontAwesome字体图标，包括安装、引入及具体用法，如调整图标大小、设置旋转和翻转效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Vue-Awesome建立在Font Awesome上 v4.5.0，取决于Vue.js v2.0.1 +，所以安装了Vue-Awesome就可以直接使用Font Awesome的字体图标。

1.安装Vue-Awesome

　　$ npm install vue-awesome

2.引入Vue-Awesome

　　在main.js文件中加入以下代码：

　　　　import 'vue-awesome/icons'
　　　　import Icon from 'vue-awesome/components/Icon'

　　　　Vue.component('icon', Icon)

3.使用

　　<icon :name="refresh" scale="2"></icon> //scale:图标大小1，2，3。。。

　　<icon :name="refresh" spin></icon> //spin:图标旋转

　　<icon :name="refresh" flip="horizontal"></icon> //flip:翻转

转载于:https://www.cnblogs.com/wangyunhui/p/7451831.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。