methods：methods里面是函數(shù)調(diào)用署浩，在調(diào)用時(shí)當(dāng)做一個(gè)普通函數(shù)調(diào)用：
<div id="app">{{sum()}}</div><!-- 顯示 3 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script type="text/javascript">
new Vue({
el : '#app',
data : {
a : 1,
b : 2
},
methods : {
sum:function () {
return this.a + this.b;
}
}
})
</script>
computed：computed是計(jì)算屬性，在調(diào)用時(shí)調(diào)用的是屬性:
<div id="app">{{sum}}</div><!-- 顯示 3 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script type="text/javascript">
new Vue({
el : '#app',
data : {
a : 1,
b : 2
},
computed : {
sum:function () {
return this.a + this.b;
}
}
})
</script>
值得一提的是methods每一次都會(huì)重新執(zhí)行函數(shù)扫尺，而computed只會(huì)執(zhí)行一次（數(shù)據(jù)改變除外）筋栋，之后都是獲取的是緩存中的計(jì)算屬性值。
computed 應(yīng)用場景
1. 適用于一些重復(fù)使用數(shù)據(jù)或復(fù)雜及費(fèi)時(shí)的運(yùn)算正驻。我們可以把它放入computed中進(jìn)行計(jì)算, 然后會(huì)在computed中緩存起來, 下次就可以直接獲取了弊攘。
2. 如果我們需要的數(shù)據(jù)依賴于其他的數(shù)據(jù)的話, 我們可以把該數(shù)據(jù)設(shè)計(jì)為computed中。
watch：watch是Vue的監(jiān)聽（偵聽）姑曙，在調(diào)用時(shí)調(diào)用的是監(jiān)聽的data里面的屬性：
<div id="app">{{sum}}</div><!-- 顯示 3 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script type="text/javascript">
new Vue({
el : '#app',
data : {
a : 1,
b : 2,
sum : 0
},
watch: {
sum:{
handler(newValue,oldValue){
this.sum = 0;
this.sum = this.a + this.b;
},
immediate:true//初始時(shí)計(jì)算一次
}
}
})
</script>
在watch中有兩個(gè)屬性值：deep和immediate襟交，還有一個(gè)handler方法。
handler方法：watch當(dāng)中的方法默認(rèn)就是這個(gè)handler方法伤靠。
deep屬性：是否深度監(jiān)聽某個(gè)對象的值, 該值默認(rèn)為false捣域。deep實(shí)現(xiàn)機(jī)制是: 監(jiān)聽器會(huì)一層層的往下遍歷, 給對象的所有屬性都加上這個(gè)監(jiān)聽器。當(dāng)然性能開銷會(huì)非常大的宴合。
immediate屬性：該值默認(rèn)是false焕梅，在進(jìn)入頁面時(shí)，第一次綁定值卦洽，不會(huì)立刻執(zhí)行監(jiān)聽贞言，只有數(shù)據(jù)發(fā)生改變才會(huì)執(zhí)行handler中的操作。當(dāng)immediate的值是true時(shí)阀蒂，在進(jìn)入頁面是就會(huì)立即執(zhí)行一次handler中的操作该窗。
watch 和 computed的區(qū)別是：
相同點(diǎn)：他們兩者都是觀察頁面數(shù)據(jù)變化的。
不同點(diǎn)：computed只有當(dāng)依賴的數(shù)據(jù)變化時(shí)才會(huì)計(jì)算, 當(dāng)數(shù)據(jù)沒有變化時(shí), 它會(huì)讀取緩存數(shù)據(jù)蚤霞。
watch每次都需要執(zhí)行函數(shù)酗失。watch更適用于數(shù)據(jù)變化時(shí)的異步操作。
