我们需要到iconfont选择图标，然后下载到本地。

iconfont官网：http://www.iconfont.cn/

下面以导入官方提供的【AIS产品图标库】为例

1.登录到iconfont

2.选择图标库

在导航栏点击【图标库】然后选择【官方图标库】

这时候我们会看到官方图标库，我们找到【AIS产品图标库】，点击进入

3.添加图标到自己的库

添加入库

进入【AIS产品图标库】后，我们可以选择自己喜欢的图标，然后添加到自己的库，具体操作，鼠标放到图标上，会出现选项，选择【添加入库】

全部添...

环境搭建

//安装全局的vue-cli命令行工具
cnpm install -g vue-cli
//创建基于'webpack'模板的新项目
vue init webpack#1.0 my-project
//切换到项目里安装依赖
cnpm install
//启动服务
npm run dev

MVVM框架

vue.js 简介

什么是vue.js
他是一个轻量级 mvvm框架
数据驱动+组件化的前端开发

vue.js的核心思想
数据驱动、组件化

组件设计原则
页面上每个独立的可视/可交互区...

        <el-button type="primary">primary</el-button>
        <el-button type="success">success</el-button>
        <el-button type="warning">warning</el-button>
        <el-button type="danger">danger...

在项目文件目录下运行如下命令，安装jquery

npm install jquery

修改build/webpack.base.conf.js文件

在开头加入一行代码

 var webpack=require("webpack")

然后在这个文件中的module.exports添加如下代码：

  plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin...

在项目路径下安装element-ui，运行命令：

npm install element-ui -s

修改main.js文件

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'

Vue.use(ElementUI)

 <el-radio class="radio" v-model="radio" label="1">备选项</el-radio>
  <el-radio class="radio" v-model="radio" label="2">备选项</el-radio>

<el-radio disabled v-model="...

父组件：

传递静态字符串

 <compinent-a msgfromfather="strings"></compinent-a>

传递父组件data里的数据

 <compinent-a :msgfromfather="fromData"></compinent-a>

子组件：

注册属性

 props:['msgfromfather'],
 //注册父组件里传递的属性

使用

...

子组件

methods:{
 onClickMe:function (){
    this.$emit('functionName'，Data)

}
//functionName为父组件里要绑定的方法，data为向父组件传递的数据

父组件

<compinent-a v-on:functionName="listenToMyBoy"></compinent-a>

methods:{
    listenToMyBoy...

用vue-router来控制用户登录权限的原理，实际上就是应用了vue-router提供的router.beforeEach来注册一个全局钩子。具体用法

根据判断是否具有登录权限来设置路由跳转，如果没有全选统一跳转到登录页面。

import router from './router'
import NProgress from 'nprogress' // Progress 进度条
import 'nprogress/nprogress.css'...