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:翻转

vue引入Vue-Awesome的更多相关文章

  1. 在普通js文件里引入vue实例的方法

    首先是我是写了一个 Loading 插件然后 是挂在打vue.prototype 原型上的. 在main.js中use使用了这个插件. 至此vue原型是就被我挂上 $loadding方法了. 然后我想 ...

  2. vue学习记录:vue引入,validator验证,数据信息,vuex数据共享

    最近在学习vue,关于学习过程中所遇到的问题进行记录,包含vue引入,validator验证,数据信息,vuex数据共享,传值问题记录 1.vue 引入vue vue的大致形式如下: <temp ...

  3. vue引入bootstrap——webpack

    想要在vue中引入bootstrap,引入的时候需要按照如下的步骤进行. 1.引入jquery 2.引入bootstrap   阅读本文前,应该能够搭建环境,使用vue-cli进行项目的创建,可以参考 ...

  4. 记webpack下引入vue的方法(非.vue文件方式)

    直接script引入下载静态的vue.js文件则最后用copy-webpack-plugin复制到一样的目录即可 使用npm安装的vue无法直接用 import vue from "vue& ...

  5. 单页面vue引入百度统计的使用方法!

    最近组长安排着做一个项目,h5的应用下载项目,想着做起来还是比较容易,可是看到提出的需求,我就有点懵逼了!需要对应用的下载进行统计!!!我当时就想着我前端怎么对页面点击按钮就行数据统计啊!我以前的项目 ...

  6. vue引入jquery的方法

    1.局部引入 通过命令下载jquery   npm install jquery --save-dev 在需要引入jquery的组件中通过import $ from 'jquery'引入即可 2.全局 ...

  7. vue 引入通用 css

    1.在入口 js 文件 main.js 中引入,一些公共的样式文件,可以在这里引入. import Vue from 'vue' import App from './App' // 引入App这个组 ...

  8. vue引入jQuery、bootstrap

    vue引入jQuery.bootstrap 1.使用vue-cli构建的vue项目 2.npm安装jquery.bootstrap npm install jquery 3.修改build/webpa ...

  9. vue 引入 mint-ui 简单使用

    一 npm 方式 1,安装依赖 (已有项目) 如果想简单体验:基于vue-cli /* npm install vue -g npm install vue-cli   -g   // -g 是否全局 ...

  10. 不再手写import - VSCode自动引入Vue组件和Js模块

    :first-child{margin-top:0!important}.markdown-body>:last-child{margin-bottom:0!important}.markdow ...

随机推荐

  1. duilib 修复Text控件无法设置宽度的bug,增加自动加算宽度的属性

    转载请说明原出处,谢谢~~: 今天有朋友反映CTextUI控件无法设置宽度,于是修复了这个bug,顺便给Text控件增加了一个自动计算宽度的属性,描述如下 <Attribute name=&qu ...

  2. JAVA Remote Object

    RMI(Remote Method Invocation)远程方法调用是一种计算机之间利用远程对象相互调用实现双方通讯的一种通讯机制.使用这种机制,某一台计算机上的对象可以调用另一台计算机上的对象来获 ...

  3. 关于IE浏览器输入框字体不兼容问题

    当写完 input的text输入框后 IE里输入框字体偏上 那么有个简单的解决办法 就是设置行高line-height:Xpx\9;就可以解决   \9表示所有IE

  4. webpack4.0.1安装问题及解决方法

    2月底的时候,webpack4正式发布了,但是当我们安装之后,使用下面的语句来打包的时候,发现打包失败了 webpack ./src/main.js ./dist/bundle.js 并且给出了下面这 ...

  5. ACM-ICPC2018 青岛赛区网络预赛-B- Red Black Tree

    题目描述 BaoBao has just found a rooted tree with n vertices and (n-1) weighted edges in his backyard. A ...

  6. 817D. Imbalanced Array 预处理最大最小 思维

    LINK 题意:给出n个数,求所有子区间的最大最小值差的和. 思路:过去有道题目是求所有子区间的最大值或最小值,这题类似,我们对每一个数计算其作为最大值得次数和最小值的次数,这两个值求法类似,都是比左 ...

  7. 无聊,纯css写了个评分鼠标移入的效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 那些相见恨晚的 JavaScript 技巧

    JavaScript 的成功让人津津乐道,为 Web 网页编写 JavaScript 代码已经是所有 Web 设计师的基本功,这门有趣的语言蕴藏着许多不为人熟知的东西,即使多年的 JavaScript ...

  9. 【BZOJ】4753: [Jsoi2016]最佳团体 01分数规划+树上背包

    [题意]n个人,每个人有价值ai和代价bi和一个依赖对象ri<i,选择 i 时 ri 也必须选择(ri=0时不依赖),求选择k个人使得Σai/Σbi最大.n<=2500,ai,bi< ...

  10. ADO.NET中带参数的Sql语句的陷阱

    1.使用Parameter //利用构造函数方式 ,不推荐这样写 Parameter p =new Parameter("@id",值); cmd.Parameters.Add(p ...