Oyente de Vue

El oyente puede detectar el número de clics en el componente.

<template>
<div>
	<h1 :style="styleObj">点击次数:{
    
    {
    
    num}}</h1>
	<button @click="addClick">点击</button>
</div>
</template>

<script>
export default{
    
    
	name:'App',
	data:function(){
    
    
		return{
    
    
			num:0
		}
	},
	methods:{
    
    
		addClick:function(){
    
    
			this.num ++;
		}
	},
	watch:{
    
      //监听器函数
	num:function(newValue,oldValue){
    
    
		console.log(newValue);
		console.log(oldValue);
		if(newValue>10){
    
    
			console.log("值大于10");
			this.styleObj = {
    
    
				backgroundColor:"red"
			}
			}
		}
	}
}
</script>