监视器
watch:{
所监听的对象:function(val){
},
}
使用watch,来实现model的数据变化即可触发
监听uname和xing;当input值发生改变时,fullName随之改变,完成字符串的拼接;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
<div>
<span>姓</span>
<input type="text" v-model="uname"/>
</div>
<div>
<span>名</span>
<input type="text" v-model="xing" />
</div>
<div>{{fullName}}</div>
</div>
<script type="text/javascript">
var vm = new Vue({
el:"#app",
data:{
uname:"",
xing:"",
fullName:""
},
watch:{
uname:function(val){
this.fullName = val+' '+this.xing;
},
xing:function(val){
this.fullName = this.uname+' '+val;
}
}
})
</script>
</body>
</html>
转载请注明原文地址:https://blackberry.8miu.com/read-18377.html