<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>监听器</title> <script src="https://cdn.jsdelivr.net/npm/vue"></script> </head> <body> <div id="root"> </div> <script> new Vue({ el: "#root", template: `<div > <input v-model="firstName"> <input v-model="lastName"> <div>{{fullName}}</div> <div>{{number}}</div> </div>`, data: { firstName: "", lastName: '', number: 0, }, computed: { fullName: function () { return this.firstName + this.lastName } }, match: { fullName: function () { console.log('数据发生了改变') this.number++ } } }) </script> </body> </html>
watch