?有粉絲在私信中聯系博主,希望博主能夠系統的出一篇關于vue的基礎篇\textcolor{blue}{ 有粉絲在私信中聯系博主,希望博主能夠系統的出一篇關于 vue的基礎篇}有粉絲在私信中聯系博主,希望博主能夠系統的出一篇關于vue的基礎篇
? 今天他來了,vue基礎系列分為三篇
?本篇是第二篇:vue基礎(中篇)\textcolor{pink}{本篇是第二篇:vue基礎(中篇)}本篇是第二篇:vue基礎(中篇)
?本篇文章涵蓋計算屬性、偵聽器、過濾器、生命周期\textcolor{green}{本篇文章涵蓋計算屬性、偵聽器、過濾器、生命周期}本篇文章涵蓋計算屬性、偵聽器、過濾器、生命周期
計算屬性
computed
- 模板中放入太多的邏輯會讓模板過重且難以維護 使用計算屬性可以讓模板更加的簡潔
- 計算屬性是基于它們的響應式依賴進行緩存的
- computed比較適合對多個變量或者對象進行處理后返回一個結果值,也就是數多個變量中的某一個值發生了變化則我們監控的這個值也就會發生變化
偵聽器
watch
- 使用watch來響應數據的變化
- 一般用于異步或者開銷較大的操作
- watch 中的屬性 一定是data 中 已經存在的數據
- 當需要監聽一個對象的改變時,普通的watch方法無法監聽到對象內部屬性的改變,只有data中的數據才能夠監聽到變化,此時就需要deep屬性對對象進行深度監聽
過濾器
介紹
Vue.js允許自定義過濾器,可被用于一些常見的文本格式化
使用場景
過濾器可以用在兩個地方:雙花括號插值和v-bind表達式。
過濾器應該被添加在JavaScript表達式的尾部,由“管道”符號指示
支持級聯操作
注意點
過濾器不改變真正的data
,而只是改變渲染的結果,并返回過濾后的版本
全局注冊時是filter,沒有s的。而局部過濾器是filters,是有s的
過濾器中傳遞參數
生命周期
事物從出生到死亡的過程,Vue實例從創建 到銷毀的過程 ,這些過程中會伴隨著一些函數的自調用。我們稱這些函數為鉤子函數
鉤子函數
寫在最后
?原創不易,還希望各位大佬支持一下\textcolor{blue}{原創不易,還希望各位大佬支持一下}原創不易,還希望各位大佬支持一下
👍 點贊,你的認可是我創作的動力!\textcolor{green}{點贊,你的認可是我創作的動力!}點贊,你的認可是我創作的動力!
?? 收藏,你的青睞是我努力的方向!\textcolor{green}{收藏,你的青睞是我努力的方向!}收藏,你的青睞是我努力的方向!
?? 評論,你的意見是我進步的財富!\textcolor{green}{評論,你的意見是我進步的財富!}評論,你的意見是我進步的財富!