Vue學習（四）——計算屬性和偵聽器
阿新 • • 發佈：2018-11-26
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>計算屬性和偵聽器</title> <script src="./vue.js"></script> </head> <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:{ //監聽某一個數據或者屬性發生了變化 fullName:function(){ this.count++; } /* firstName:function(){ this.count++; }, lastName:function(){ this.count++; }*/ } }) </script> </body> </html>
注：學習筆記內容來自：https://www.imooc.com/learn/980
官網：cn.vuejs.org