计算属性
<body>
<div id="root">
姓：<input v-model="firstName"/>
名：<input v-model="lastName"/>
<div >{{fullName}}</div>
</div>
<script>
new Vue({
el: "#root",
data: {
firstName:"",
lastName:""
},
// 计算属性
computed: {
fullName: function() {
return this.firstName+ '' + this.lastName
}
}
})
</script>
</body>
侦听器
<body>
<div id="root">
姓：<input v-model="firstName"/>
名：<input v-model="lastName"/>
<div >{{fullName}}</div>
<div>{{count}}</div>
</div>
<script>
new Vue({
el: "#root",
data: {
firstName:"",
lastName:"",
count: 0
},
// 计算属性
computed: {
fullName: function() {
return this.firstName + '' + this.lastName
}
},
watch: {
// firstName: function () {
// this.count++
// },
// lastName: function () {
// this.count++
// },
//简写
fullName: function() {
this.count++
}
}
})
</script>
</body>