您的位置:首頁/技術文章
文章詳情頁

簡單了解Vue computed屬性及watch區別

瀏覽:75日期:2023-01-08 15:36:04

自己的理解:

1. computed用來監控自己定義的變量,該變量不在data里面聲明,直接在computed里面定義,然后就可以在頁面上進行雙向數據綁定展示出結果或者用作其他處理;

2. computed比較適合對多個變量或者對象進行處理后返回一個結果值,也就是數多個變量中的某一個值發生了變化則我們監控的這個值也就會發生變化,舉例:購物車里面的商品 列表和總金額之間的關系,只要商品列表里面的商品數量發生變化,或減少或增多或刪除商品,總金額都應該發生變化。這里的這個總金額使用computed屬性來進行計算是最好 的選擇

與watch之間的區別:

剛開始總是傻傻分不清到底在什么時候使用watch,什么時候使用computed。這里大致說一下自己的理解:

watch主要用于監控vue實例的變化,它監控的變量當然必須在data里面聲明才可以,它可以監控一個變量,也可以是一個對象,但是我們不能類似這樣監控,比如:

watch:{goodsList.price(newVal,oldVal){ //監控商品列表中是商品價格}}

這樣會報錯。只能監控整個對象或單個變量,如下所示:

data(){return {example0:'',example1:'',example2:{ inner0:1,    innner1:2    }}},watch:{ example0(newVal,oldVal){//監控單個變量 …… },example2(newVal,oldVal){//監控對象 …… },}

watch一般用于監控路由、input輸入框的值特殊處理等等,它比較適合的場景是一個數據影響多個數據

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持好吧啦網。

標簽: Vue
相關文章:
国产综合久久一区二区三区