一、基本语法：
1、实例化：new Vue({})
2、el：一定是根容器元素（vue的作用域就是这个根元素内），就是写选择器
data：用于存储数据
methods：定义方法（方法里this指向当前vue实例化的对象，但是获取属性和方法不需要this.data.name，直接this.name即可，获取方法也是如此）
二、数据绑定：给属性绑定对应的值
（1）v-bind的使用：v-bind:href="website"，v-bind:value="value"（注意此处就不需加双大括号了）
（2）v-html用于绑定输出html元素：
三、事件：
（1）v-on:click="事件名"（有参数的话就是事件名(参数)），简写：@click="事件"
（2）事件修饰符：v-on:click.事件修饰符
v-on:click.once="add(1)"，v-on:mousemove.stop，v-on:click.prevent="add"（阻止默认事件）
（3）键盘事件keyup、keydown，
键盘修饰符：keyup.enter、keyup.alt.enter(链式：alt+enter键)
四、双向数据绑定：input/select/textarea
（1）v-model指令
（2）ref机制：给input标签标记
方法里面利用this.$refs.name.value去获取值
五、动态绑定css样式：
（1）v-bind:class="{red:true,blue:true}"
六、条件与循环
（1）v-if/v-else-if/v-else、v-show，两者的区别（有无实际dom元素的区别）
（2）v-for、列表渲染template
（3）v-for里面对数组默认的有{{$index}}索引，对json对象默认有{{$index}}、{{$key}}键值，或：v-for="(k,v,index) in json"
七、事件深入：
（1）事件对象$event：@click="show($event)"
（2）事件冒泡：
阻止冒泡：
1、原生的：$event拿到事件对象，然后方法里面ev.cancelBubble=true
2、@click.stop="show()"
阻止默认行为：
1、原生的：$event拿到事件对象，然后方法里面ev.preventDefault()
2、@contextmenu.prevent(阻止右键默认行为)
（3）键盘事件：@keydown、@keyup、$event、ev.keyCode（获取键值）
常用键：@keydown.13或@keydown.enter/@keydown.up(上下左右均可)
八、属性
v-bind绑定属性：v-bind:src="url"
此方式效果可以出来，但会报错
，效果出来，不会发请求
v-bind简写就是冒号：:src="url"
九、class和style
（1）class：
1、:class="[red,blue]" red/blue指的是data里的数据，data里的red/blue再去指向实际的class名
2、:class="{red:true,blue:true}"或者:class="{red:a,blue:b}",a/b为data里的数据true/false
3、:class="json"，即把方法2的json放到data里面去
（2）style：跟class写法一样
1、:style="[c,b]"；
注意：复合样式需要采用驼峰命名法
2、:style="{width:'200px',color:'red'}"或者:style="{width:a,color:b}"
3、:style="json"
十、模板
v-model指令
{{msg}} 数据更新、模板随着变化
{{*msg}} 数据只绑定一次
{{{msg}}} HTML转意输出
十一、过滤器
过滤模板的数据
（1）系统提供一些过滤器:capitalize/lowercase/uppercase
语法：{{msg|fiter}}单个、{{msg|fiterA|fiterB}}多个
currency 钱的标志
{{msg|fiter 参数}}，比如{{12|currency "￥"}}就变成：￥12.00
十二、交互
如果vue想做交互，必须引入vue-resource
一般三种交互方式：get、post、jsonp，或直接this.$http({……})
1、get：
向本地文件取数据
//1、this.$http，指向当前的ajax对象
//2、promise的写法
this.$http.get('a.txt').then(function(res){
alert(res.data);//成功
},function(res){
alert(res.status);//失败
});
向服务器传参数，然后取结果
this.$http.get('get.php',{
a:1,
b:2
}).then(function(res){
alert(res.data);
},function(res){
alert(res.status);
});
2、post：需要加请求头信息
this.$http.post('post.php',{
a:1,
b:20
},{
emulateJSON:true
}).then(function(res){
alert(res.data);
},function(res){
alert(res.status);
});
3、jsonp
this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{
wd:'a' //参数
},{
jsonp:'cb' //指定callback名字，默认就是callback
}).then(function(res){
alert(res.data.s);
},function(res){
alert(res.status);
});
4、this.$http()
this.$http({
url:地址
data:给后台提交数据,
method:'get'/post/jsonp
jsonp:'cb' //callback名字
}).then();