注:实例环境 vue cli构建的项目
app.vue
<template> <Example></Example> </template> <script> import Example from './components/Example' export default { name: 'App', components: { Example } } </script> <style> </style>
Example.vue
<template> <div> <p> <label>text文本</label> <input type="text" v-model="text"/> </p> <p> <label>watch文本</label> {{watchText}} </p> </div> </template> <script> export default { name: "Example", data:function () { return { text:'', watchText:'' } }, watch:{ text(newText, oldText) { console.log('newText:' + newText); console.log('oldText:' + oldText); this.watchText = newText } } } </script> <style scoped> </style>