Vue入門之計(jì)算屬性和監(jiān)聽器

六.計(jì)算屬性和監(jiān)聽器
6.1計(jì)算屬性 computed
6.1.1存在問題
插值表達(dá)式, 可以完成表達(dá)式的計(jì)算,如果邏輯復(fù)雜時(shí),將很難維護(hù). 例如:

6.1.2基本使用
Vue計(jì)算屬性computed就是用來處理復(fù)雜邏輯的. 當(dāng)data區(qū)域的數(shù)據(jù)變更是,將進(jìn)行自動(dòng)計(jì)算.

案例：字符串倒排

6.1.3computed和methods區(qū)別

計(jì)算屬性，用于實(shí)時(shí)計(jì)算，只要數(shù)據(jù)發(fā)生了更改才計(jì)算。緩存計(jì)算結(jié)果。
方法，每次調(diào)用都執(zhí)行

計(jì)算屬性

普通方法

6.1.4案例：購物車

編號(hào)	標(biāo)題	單價(jià)	購買數(shù)量	小計(jì)
{{index+1}}	{{book.title}}	{{book.price}}	- {{book.count}} +	{{book.price * book.count}}
			總價(jià)：{{totalPrice}}

6.1.5高級(jí)使用

計(jì)算屬性提供了setter方法對(duì)屬性進(jìn)行修改

}
},
})

案例：拆分姓名（第一版）

請(qǐng)輸入姓名：

姓：{{firstname}}

名：{{secondname}}

6.2監(jiān)聽器 watch

6.2.1什么是監(jiān)聽器

監(jiān)聽數(shù)據(jù)的變化

})

6.2.2基本語法

案例：拆分姓名（第二版）

請(qǐng)輸入姓名：

姓：{{firstname}}

名：{{secondname}}

6.2.3高級(jí)使用：監(jiān)聽對(duì)象屬性

案例：拆分姓名（第三版）

請(qǐng)輸入姓名：

姓：{{firstname}}

名：{{secondname}}

聲明：本文內(nèi)容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權(quán)轉(zhuǎn)載。文章觀點(diǎn)僅代表作者本人，不代表電子發(fā)燒友網(wǎng)立場(chǎng)。文章及其配圖僅供工程師學(xué)習(xí)之用，如有內(nèi)容侵權(quán)或者其他違規(guī)問題，請(qǐng)聯(lián)系本站處理。舉報(bào)投訴