angular: 国外 上手难 庞大
vue: 国产 上手简单 小巧
下载：
1.官网下载
2.bower install vue
npm install -g bower
bower:
初始化，生成包的配置文件 ： bower init
生成一个 bower.json
安装特定版本的包文件 ： bower install vue#2.2.1
查看所有版本： bower info vue
一、
基本写法：
let vm = new Vue({
el: '#div1' //element 要控制的元素，选择器，
data:{
a:1//数据
}
});
二、基本用法
1、vue的数据都在 data里
2、函数，方法都要放在指定的一个地方
methods:{}
3、事件 v-on:
v-on: click
没有参数：
v-on:click="show"
有参数时：
v-on:click="show2(12)"
4、el:'#div1'
指明了 vue对象控制的范围，不能是body也不能是html
5、v-on:click —— 简写： @click
6、在methods中，this —— 表示的是 new 出的vue对象:vm
不能用箭头函数，因为箭头函数里面，this表示的是父级作用域——window
7、v-show/hide
true:显示 false:隐藏
通过控制 display 属性，来实现的隐藏和显示
8、v-model
绑定数据
9、v-if
通过增加、删除DOM元素，来实现的显示和隐藏
10、v-else
必须和v-if配对使用，必须得在一起
11、v-for: 循环 相当于ng-repeat
数组：
v-for="val in arr"
v-for="(val,index) in arr"
v-for="val in 数字"
数字：从1开始
JSON:
v-for="val in json"
v-for="(val,name) in json"
v-for="(val,name,index) in json"
12、vue里，$index track by不再使用，解决了数组不允许重复的问题
13、属性
v-bind:属性名
简写： 省略 v-bind
14、 :class 'red bor'
数组：
:class = "['red','bor']"
JSON:
:class="{'red':false}"
15、style
:style
:style="{width:'200px',heigth:h+'px',fontSize:'20px'}"
16、computed
el:
methods:
data:
computed:
17、解决闪烁的问题
[v-clock]{
display:none;
}
<div v-clock>
总结:
1.v-on:click
@click
2.v-bind
:class
[]
''
{}
3.v-if
v-else
v-show/hide
v-for
arr
json
number 1...
(v,n,i)
4.el
data
methods
computed
5.v-modle
6.v-clock
7.v-bind:style
{} 解构赋值
[]
