vue，vue，vue，vue，vue，

1. vue 的三个特点：
数据双向绑定，组件化，单文件组件

2、vue的基本概念

全局api：  vue.extend, vue.set
实例选项: new Vue()  el,data,compents都是vue实例选项
实例属性和方法： vm.$on,vm.$data  在$都是vue的实例和方法
指令：directive
内置组件：
 

3、功能接口
v-for = (item,index) in arry;//item 数组的每一项， index：数组的索引；
v-for = (value,key) in obj // value：对象的值，key对象的属性；
数组中不可用的方法：
slice，concat；直接修改数组list[i] = 值，不可以这样直接修改；
Vue.set(数组，索引，{值}) vue的全局方法set来更改数组的某一项的值

// 标签属性和条件渲染
标签属性：  v-bind：href='link";动态绑定；
条件渲染： v-if，v-else，v-show；

// 事件绑定-内置事件绑定，自定义事件绑定
@：click 事件绑定；
自定义事件绑定： 父组件自定义事件   

子组件触发 my-event 自定义事件；this.$emit('my-event', opation)；
父组件执行toggle 函数；

// 计算属性和数据监听
computed选项 -计算属性：根据我们调用属性来跟新，调用的属性没有变更，
  我们computed选项里面的方法读取的是缓存；

// 组件的通信
 动态绑定组件

子组件props接受的两种形式：
数组：
     ['first-name','two-name'] ，从父组件传递两个属性值；
     动态展现{{firstName}}
对象：
    {
 'first-name':[number,string]//接受的类型可以是number或者string；
    }

// slot：插槽
父组件插件里面定义的内容放到子组件slot中：

    
我是父组件header
    
我是父组件footer

子组件

    
    
it is children content
     


//  vue高级功能--过渡和动画

    // 过渡效果要一定的条件
    多元素过渡：如果标签名相同，我们需要指定一下key，否则没有效果；
    

    


     或者
    或者
    动态组件


// 自定义指令：

directive:{
    foucus: {
 inserted(el,bind){
     el.foucus()
 }
    }
}

4、 环境搭建和常用插件

---- 使用 vue-cli的优势：
    成熟的vue项目架构设计；
    本地测试服务器； 
    集成打包上线方案 webpack

    使用vue-cli的系统要求：
    node.js  (>=4.x);
    git
    一个能使用node的命令行终端 git bash  或者cmd

npm install vue-cli -g :全局安装vue-cli
vue init webpack my-project ：初始化项目
npm install 安装项目依赖

npm run dev：在localhost启动测试服务器；
npm run bulid 生成上线目录（部署）

5. vue-router （设置路由） vue 的插件
 npm install vue-router --save  安装 vue-router

 import VRouter from ‘vue-router’ ： 在入口页引入vue-router；
 Vue.use(VRouter );  Vue.use注册使用vue-router
 引入router，我们需要实例化这个router类，
 let router = new VRouter({ // 定义自己项目的router变量；
})

new Vue({
  el: '#app',
  router:router,
  template: '',
  components: {APP}
})