vue

vue
前端js框架
js框架：jQuery $("#div1").click(function(){});
MVVM模式 M V VM
双向绑定。
视图和数据模型的双向绑定。
渐进式框架
逐步学习使用这个框架。
生命周期
创建：
直接new Vue对象即可。
传入的参数（格式为json）
key的含义：
el：指定一个页面元素，受vue实例的管理。只有被vue实例管理的元素内部才能使用vue的语法。
data：定义vue实例中使用到的数据。本身就是一个json。
methods：定义vue实例的一些函数
computed: 计算属性，内部可以定义一系列的函数。函数的名称可以当成计算属性的key看待，函数的返回值即当前计算属性的值。
通俗来说，计算属性就是把函数当成一个data中的数据来使用。只不过内部是经过一系列的逻辑计算出一个值。
watch: 监控属性，可以指定一些方法，监控关心的值的变化。
1. 监控简单数据
定义一个和监控的变量名称一致的函数即可。函数的参数为新值和旧值
例如：message(newValue, oldValue)
2. 监控对象中的数据——深度监控
定义个和监控的对象名称一致的属性，值是一个json。内部设置deep属性为true代表深度监控开启。回调函数为handler，会传过来新的对象
例如：
watch:{
person: {
//开启深度监控；监控对象中的属性值变化
deep: true,
//可以获取到最新的对象属性数据
handler(obj){
console.log("name = " + obj.name + "; age=" + obj.age);
}
}
}
钩子函数的名称
例如：
created
创建完毕的回调函数，一般用于初始化数据。
语法：
插值表达式:用于在页面上取vue实例中的数据显示
v-html和v-text属性
相当于原生js中的innerHTML和innerText

v-html
v-text

	v-model
		用于数据和视图的双向绑定。一般用在表单项或者vue组件之上。
	v-on
		用于给元素绑定事件
			v-on:事件名
			例如：v-on:click
		简写方式
			@事件名
			例如： @click
		值可以指定为一个函数的名称，也可以为一句js代码。

		事件修饰符
			写到事件绑定之后，给当前事件添加额外的修饰以打成某个功能
				.stop ：阻止事件冒泡
					事件冒泡：
						默认情况下，我们在某个页面元素上触发的事件，在当前元素处理完之后会自动传递给父元素。父元素也会触发该事件
				.prevent ：阻止默认事件发生
					阻止浏览器默认的一些事件行为。
						例如：
							获取焦点事件会把光标放入输入框
							表单提交事件会提交数据到action指定的url
				.capture ：使用事件捕获模式
					相当于是和冒泡相反，父元素先于子元素获取事件。
				.self ：只有元素自身触发事件才执行。（冒泡或捕获的都不执行）
				.once ：只执行一次

	v-for
		用于遍历数组（集合）或json 对象，v-for写到哪个元素上作为属性，那么哪个元素就会重复出现。
			遍历数组或集合
				v-for="(element, index) in array"
			遍历json对象
				 v-for="(value, key, index) in jsonObject"
		:key="当前元素的唯一标识"
			用于指定一个唯一的标识，让vue展示数据时复用性更好
	v-if  v-show
		用于指定一个boolean值的表达式，根据表达式判断当前元素是否显示。
			区别；
				v-if当表达式为false时，元素直接从dom中移除。支持else或else if语法
				v-show当表达式为false时，仅仅是把元素设置为隐藏display：none。而没有移除元素。
	v-bind
		用于在元素上指定属性值为vue中data的数据的。
		语法
			v-bind:属性名
			简写为：
				:属性名