摘要：
关于Vue监控：watchwatch监控基本数据类型的单一属性复杂数据类型的简单监控深度监控以下代码包括简单监控和深度监控button@click=“Stus[0].name='rose'”˃更改{｛Stus[0]:name}｝{{message｝｝varvm=newVue
关于Vue的监听:watch
watch是对单个属性的监听
对于基本数据类型的监听 简单监视
对于复杂数据类型的监听 深度监视
下面的代码,有一个简单监视 和 一个深度监视
<body> <div id="app"> <input type="text" v-model='msg' /><br><br> <button @click="stus[0].name='rose'">改变</button> <h2>{{stus[0].name}}</h2> <h1>{{message}}</h1> </div> <script src="./js/vue.js"></script> <script> var vm = new Vue({ el: '#app', data() { return { msg: '', stus: [{ name: 'jack' }], message: '' } }, watch: { msg: function (newV, oldV) {//简单监视 console.log(newV, oldV); if (newV === 'abcdefg') { console.log('这是通过监听器,watch监听到的') } }, stus: { deep: true,//深度监视 handler: function (newV, oldV) { console.log(newV[0].name) this.message = newV[0].name } } } }) </script> </body>