创建一个vue单文件

<template>
<div id="test">
<h4 @click="changeMsg()" id="outputDom">{{msg}}</h4>
</div>
</template> <script>
export default {
name: "test",
data:function(){
return{
msg:'test msg'
}
},
watch:{
msg:function(){
console.log('msg进行了改变');
}
},
mounted:function(){
},
methods:{
changeMsg:function(){
this.msg = "改变MSG"
}
}
}
</script> <style lang="less">
</style>

  

这个时候我点击h4标签的时候 便会触发watch中的msg方法

05-11 11:10