Vue開發(fā)之watch監(jiān)聽數(shù)組、對象、變量操作分析
本文實(shí)例講述了Vue開發(fā)之watch監(jiān)聽數(shù)組、對象、變量操作。分享給大家供大家參考,具體如下:
1.普通的watch
data() { return { frontPoints: 0 } }, watch: { frontPoints(newValue, oldValue) { console.log(newValue) } }
2.數(shù)組的watch:深拷貝
data() { return { winChips: new Array(11).fill(0) } }, watch: { winChips: { handler(newValue, oldValue) { for (let i = 0; i < newValue.length; i++) { if (oldValue[i] != newValue[i]) { console.log(newValue) } } }, deep: true } }
3.對象的watch
data() { return { bet: { pokerState: 53, pokerHistory: 'local' } } }, watch: { bet: { handler(newValue, oldValue) { console.log(newValue) }, deep: true } }
4.對象的具體屬性的watch:
data() { return { bet: { pokerState: 53, pokerHistory: 'local' } } }, computed: { pokerHistory() { return this.bet.pokerHistory } }, watch: { pokerHistory(newValue, oldValue) { console.log(newValue) } }
希望本文所述對大家vue.js程序設(shè)計(jì)有所幫助。
相關(guān)文章
vue-i18n的9以上版本中@被用作特殊字符處理,直接用會(huì)報(bào)錯(cuò)問題
這篇文章主要介紹了vue-i18n的9以上版本中@被用作特殊字符處理,直接用會(huì)報(bào)錯(cuò)問題,具有很好的參考價(jià)值,希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-08-08vue 項(xiàng)目 iOS WKWebView 加載
這篇文章主要介紹了vue 項(xiàng)目 iOS WKWebView 加載問題,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-04-04element-ui中el-table不顯示數(shù)據(jù)的問題解決
這篇文章主要介紹了element-ui中el-table不顯示數(shù)據(jù)的問題解決,這是最近在做列表首頁時(shí)遇到的一個(gè)問題,文中通過圖文介紹的非常詳細(xì),需要的朋友可以參考下2023-07-07詳解Vue組件之間的數(shù)據(jù)通信實(shí)例
本篇文章主要介紹了詳解Vue組件之間的數(shù)據(jù)通信實(shí)例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-06-06vue3容器布局和導(dǎo)航路由實(shí)現(xiàn)示例
這篇文章主要為大家介紹了vue3容器布局和導(dǎo)航路由實(shí)現(xiàn)示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-06-06去掉vue 中的代碼規(guī)范檢測兩種方法(Eslint驗(yàn)證)
我們在使用vue 腳手架時(shí),為了規(guī)范團(tuán)隊(duì)的代碼格式,會(huì)有一個(gè)代碼規(guī)范檢測,如果不符合規(guī)范就會(huì)報(bào)錯(cuò),有時(shí)候我們不想按照他的規(guī)范去寫。這時(shí)我們需要關(guān)閉,這里腳本之家小編給大家?guī)砹巳サ魐ue 中的代碼規(guī)范檢測兩種方法(Eslint驗(yàn)證),一起看看吧2018-03-03Vue3點(diǎn)擊側(cè)邊導(dǎo)航欄完成切換頁面內(nèi)組件全過程(WEB)
寫頁面的時(shí)候都會(huì)用到一些導(dǎo)航欄、點(diǎn)擊不同的部分切換不同的頁面,下面這篇文章主要給大家介紹了關(guān)于Vue3點(diǎn)擊側(cè)邊導(dǎo)航欄完成切換頁面內(nèi)組件的相關(guān)資料,需要的朋友可以參考下2023-06-06