1、定义一个基本的vue代码结构
<script>
var vm = new Vue({
el: '#app', //节点
data: { // 属性值
xxxx: xxxx
},
methods: { //事件，一般在vue中以s结尾的通常为数组，但是methods中是对象
}
})
</script>
2、差值表达式v-cloak和v-text
v-cloak: 需要加样式`style：none`， 解决插值表达式闪烁的问题。
v-text: 也可以解决插值表达式闪烁的问题,但是如果需要在里面拼接字符串时，会覆盖元素中原本的内容，但是插值表达式只会替换自己的这个占位符，不会把整个元素的内容清空。
3、v-html 如果插值表达式中有html元素，使用v-html会被解析
4、v-bind： vue提供的属性绑定机制 缩写为 :
5、v-on: vue提供的事件绑定机制，缩写为@
<input type="button" value="按钮" :title="" @click= "">
箭头函数内部的this永远和外部的this保持一致，用来解决this不一致问题。
() => {}
6.事件修饰符
.stop 阻止冒泡
.prevent 阻止时间的默认行为
.capture 添加事件侦听器时使用时间捕获模式
.self 只当事件在该元素本身（非子元素）触发时触发回调
.once 事件只触发一次
7、 v-bind：实现属性绑定。只能实现数据的单向绑定。
<input type="button" v-bind: value="">
8、 v-model: 实现数据表单元素和model中数据的双向绑定。
注意： v-model只能运用在表单元素中。（input textarea select checkbox）
<input type="button" v-model="">
9、v-for 循环
如：数组遍历
<p v-for="(item, i) in xxx">{{ i }} {{ item }}</p>
对象， 在遍历对象身上的键值对时，除了有key， value，在第三个位置还有一个参数是索引
<p v-for="(key, value, i) in xxx">{{ key }} {{ value }} {{ i }}</p>
v-for循环中key属性的使用
*v-for循环的时候，key属性只能使用number或者string
key在使用的时候，必须使用v-bind属性绑定的形式，指定key的值
在组件中，使用v-for循环的时候，或者在一些特殊情况下，如果v-for有问题，必须在使用v-for的同时，指定唯一的字符串/数字 :key = *
10、v-if 每次都会重新删除或者创建元素，有较高的切换性能消耗。
11、v-show 每次不会进行dom的删除和创建操作，只是切换了元素的display：none属性。有较高的初始渲染消耗
如果元素涉及到频繁的切换，最好不要使用v-if
12 vue常用的数组方法：
- filter(): 创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
const arr= [32, 33, 16, 40];
const arr1 = arr.filter(item => item >= 18)
console.log(arr) // [32, 33, 16, 40]
console.log(arr1) // [32, 33, 40]
- map 返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值
安装vue调试工具
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?h1=zh-CN
