簡單了解Vue computed屬性及watch區(qū)別
自己的理解:
1. computed用來監(jiān)控自己定義的變量,該變量不在data里面聲明,直接在computed里面定義,然后就可以在頁面上進(jìn)行雙向數(shù)據(jù)綁定展示出結(jié)果或者用作其他處理;
2. computed比較適合對多個變量或者對象進(jìn)行處理后返回一個結(jié)果值,也就是數(shù)多個變量中的某一個值發(fā)生了變化則我們監(jiān)控的這個值也就會發(fā)生變化,舉例:購物車?yán)锩娴纳唐?列表和總金額之間的關(guān)系,只要商品列表里面的商品數(shù)量發(fā)生變化,或減少或增多或刪除商品,總金額都應(yīng)該發(fā)生變化。這里的這個總金額使用computed屬性來進(jìn)行計算是最好 的選擇
與watch之間的區(qū)別:
剛開始總是傻傻分不清到底在什么時候使用watch,什么時候使用computed。這里大致說一下自己的理解:
watch主要用于監(jiān)控vue實例的變化,它監(jiān)控的變量當(dāng)然必須在data里面聲明才可以,它可以監(jiān)控一個變量,也可以是一個對象,但是我們不能類似這樣監(jiān)控,比如:
watch:{goodsList.price(newVal,oldVal){ //監(jiān)控商品列表中是商品價格}}
這樣會報錯。只能監(jiān)控整個對象或單個變量,如下所示:
data(){return {example0:'',example1:'',example2:{ inner0:1, innner1:2 }}},watch:{ example0(newVal,oldVal){//監(jiān)控單個變量 …… },example2(newVal,oldVal){//監(jiān)控對象 …… },}
watch一般用于監(jiān)控路由、input輸入框的值特殊處理等等,它比較適合的場景是一個數(shù)據(jù)影響多個數(shù)據(jù)
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
