JS，Vue2，事件处理，计算属性，监视属性，class与style绑定

　　VUE事件处理
　　用v-on指令或者@监听DOM事件，并在触发时运行一些JavaScript代码；
　　参考：JS，Vue2，介绍，与Vue3区别，MVVM设计模式，模板语法，数据绑定
　　Vue中的事件修饰符：
　　1、prevent：阻止默认事件（常用）；
　　2、stop：阻止事件冒泡（常用）；
　　3、once：事件只触发一次（常用）；
　　4、capture：使用事件的捕获模式；
　　5、self：只有event.target是当前操作的元素时才触发事件；
　　6、passive：事件的默认行为立即执行，无需等待事件回调执行完毕；
　　Vue中常用的按键别名：
　　回车 => enter、删除 => delete (捕获＂删除＂和＂退格＂键)、退出 => esc、空格 => space、换行 => tab (特殊，必须配合keydown去使用)、上 => up、下 => down、左 => left、右 => right等。
　　代码案例   	 		 		 		          		 	 	                      
{{name}}++
 			提示信息1 --> 			提示信息2 --> 			提示信息3（传参） 			
 			 			 			提示信息 			
 			 			 				提示信息 				 				 			 			
 			 			提示信息 			
 			 			 				p1 				 					p2 				 			 			
 			 			 				提示信息 			 			
 			 			 			
 				
111111112
 				
222222222
 				
333333333
 				
444444444
 			
 			 			 			                   	 VUE计算属性
　　模板内的表达式是非常便利的，用于简单的运算。当其过长或逻辑过于复杂时，会难以维护，因此，当遇到复杂的逻辑时应该使用计算属性，用computed计算属性。
　　代码案例   	 		 		 		          	 	          			
{{name}}
 			
 			
 				
 					通过methods来完成 				
 			
 			 			 			全名：{{fullName()}} 			
 			
 				
通过改变firstName2和lastName2来改变fullName2
 				
通过改变fullName2来调整firstName2和lastName2
 			
　　 			 			全名：
　　
 			
 				
通过改变firstName3和lastName3来改变fullName3
 			
　　 			 			全名：
　　 VUE监视属性
　　通过watch来响应数据的变化。
　　代码案例   	 		 		 		          	 	                      
状态变化1：
             状态  {{computedStatus1}}             
             
状态变化2：
             状态  {{statusName2}}             
             
状态变化3：
             状态  {{statusName3}}             
             
状态变化4：
             状态  {{statusName4}}             
             
深度监视，a的值是：{{numbers.a}}
 			a+1             
             
深度监视，b的值是：{{numbers.b}}
 			b+1                   	 VUE绑定样式
　　class样式，写法:class=＂xxx＂ ，其中xxx可以是字符串、对象、数组。
　　1、字符串写法适用于：类名不确定，要动态获取。
　　2、对象写法适用于：要绑定多个样式，个数不确定，名字也不确定。
　　3、数组写法适用于：要绑定多个样式，个数确定，名字也确定，但不确定用不用。
　　style样式，写法：:style=＂{fontSize: xxx}＂，其中xxx是动态值；:style=＂[a,b]＂其中a、b是样式对象。
　　代码案例   	 		 		 		          		 	 	                       			{{name}}
　　
 			 			{{name}}
　　
 			 			{{name}}
　　
 			 			{{name}}
　　
 			 			{{name}}