計算方法/偵聽器/屬性
<html lang="en">
<head>
<meta charset="UTF-8">
<title>計算方法屬性偵聽器</title>
<script src="./vue.js"></script>
</head>
<body>
<div id="app">
{{fullName}}
{{age}}
</div>
<script>
var vm = new Vue({
el:"#app",
data:{
firstName:"Dell",
lastName:"Lee",
fullName:"Dell Lee",
age:28
},
//監聽器（有緩存）
watch:{
firstName:function () {
console.log("computed once");
this.fullName = this.firstName + " " + this.lastName;
},
lastName:function () {
console.log("computed once");
this.fullName = this.firstName + " " + this.lastName;
}
}
//方法(無緩存)
/*methods:{
fullName : function () {
console.log("computed once");
return this.firstName + " " + this.lastName
}
}*/
//計算屬性(有緩存)推薦
/*computed:{
fullName:function () {
console.log("computed once");
return this.firstName + " " + this.lastName
}
}*/
})
</script>
</body>
</html>
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章