vue侦听器watch（）

侦听器watch（）

侦听器侦听数据变化，我们可以使用watch 选项在每次响应式属性变化时触发一个函数。

<template><h3>侦听器watch</h3><hr>
<p>{{nessage}}</p>
<button @click="exchage">点击</button></template><script>export default {data(){return{nessage:"前端",}},methods:{exchage(){this.nessage="后端"}},//侦听器//watch:监听数据的变化，当数据发生变化时，会自动执行对应的函数//newVal:新的值//oldVal:旧的值watch:{nessage(newVal,oldVal){//当数据发生变化时，会自动执行对应的函数console.log(newVal,oldVal)}}}</script><style scoped>.active{color:red;}</style>

watch:监听数据的变化，当数据发生变化时，会自动执行对应的函数
newVal:新的值
oldVal:旧的值
函数名必须与侦听器的数据对象名保持一致
运行结果：