一.計算屬性（computed）

創(chuàng)新互聯(lián)建站主要從事成都網(wǎng)站制作、網(wǎng)站設(shè)計、網(wǎng)頁設(shè)計、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務。立足成都服務徐州,10年網(wǎng)站建設(shè)經(jīng)驗,價格優(yōu)惠、服務專業(yè),歡迎來電咨詢建站服務:13518219792

這里需要注意的是computed中的函數(shù)名不能和所操作data中的數(shù)據(jù)一樣；computed中的函數(shù)名相當于是操作data數(shù)據(jù)后的新數(shù)據(jù)，在模塊中直接使用這個函數(shù)名即可實現(xiàn)對data中數(shù)據(jù)改變的渲染。

二.監(jiān)聽器（watch）

首先確認 watch是一個對象，一定要當成對象來用。

對象就有鍵，有值。

第一種 鍵：就是你要監(jiān)聽的那個數(shù)據(jù)，比如說$route，這個就是要監(jiān)控路由的變化。或者是data中的某個變量。

值可以是函數(shù)：就是當你監(jiān)控的家伙變化時，需要執(zhí)行的函數(shù)，這個函數(shù)有兩個形參，第一個是改變后的新值，第二個是改變之前的值。

第二種  值也可以是函數(shù)名：不過這個函數(shù)名要用單引號來包裹。(不常用)

第三種情況厲害了(監(jiān)聽的那個數(shù)據(jù)值是一個對象):

值是包括選項的對象：選項包括有三個。

•     第一個handler：其值是一個回調(diào)函數(shù)。即監(jiān)聽到變化時應該執(zhí)行的函數(shù)。
•     第二個是deep：其值是true或false；確認是否深入監(jiān)聽。（一般監(jiān)聽時是不能監(jiān)聽到對象屬性值的變化的，數(shù)組的值變化可以聽到。）
•     第三個是immediate：其值是true或false；確認是否以當前的初始值執(zhí)行handler的函數(shù)。

用法一：基礎(chǔ)用法

用法二：handler方法和immediate屬性

注意到handler了嗎，我們給 watchMsg綁定了一個handler方法，之前我們寫的 watch 方法其實默認寫的就是這個handler，Vue.js會去處理這個邏輯，最終編譯出來其實就是這個handler。

而immediate:true代表如果在 wacth 里聲明了watchMsg之后，就會立即先去執(zhí)行里面的handler方法，如果為 false就跟我們以前的效果一樣，不會在綁定的時候就執(zhí)行。

用法三：

deep屬性

watch 里面還有一個屬性 deep，默認值是 false，代表是否深度監(jiān)聽，比如我們 data 里有一個obj屬性/數(shù)組：

2、數(shù)組的watch

3、數(shù)組中對象的watch

4、對象具體屬性的watch［活用computed］

從效果圖上可以看出，計算屬性最好使用在更改數(shù)據(jù)上然后進行渲染；先進行的計算屬性再進行的監(jiān)聽。

若有不足請多多指教！希望給您帶來幫助！

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對創(chuàng)新互聯(lián)的支持。如果你想了解更多相關(guān)內(nèi)容請查看下面相關(guān)鏈接