一篇文章教你簡單使用Vue的watch偵聽器
更新時間：2021年12月08日 15:51:44 作者：wait......
這篇文章主要為大家介紹了Vue watch偵聽器，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
偵聽器watch?
- 函數(shù)名就是要偵聽的元素的名字
- 傳入的參數(shù)第一個是變化后的新值newval，第二個是變化前的舊值oldval?
格式
方法格式的偵聽器
- 無法在剛進入頁面時自動觸發(fā)，只有在偵聽到變化才會觸發(fā)
- 如果偵聽的是對象，當對象的屬性發(fā)生變化時，不會偵聽到
對象格式的偵聽器
- 通過immediate選項，可以讓偵聽器自動觸發(fā)
- 通過deep選項，使偵聽器深度偵聽到對象中屬性的變化
這是Vue實例中的data對象：
設(shè)置偵聽器：
下面分別是方法格式的偵聽器和對象格式的偵聽器：
方法格式的偵聽器實現(xiàn)的是，當input中內(nèi)容變化時，觸發(fā)偵聽，偵聽input中的內(nèi)容（內(nèi)容是與tem綁定好的），如果當前input中的內(nèi)容不在already數(shù)組中，就添加到already中，否則彈出提示框該名稱已存在
對象格式的偵聽器實現(xiàn)的是，頁面一旦載入就立即觸發(fā)偵聽，偵聽foo對象name屬性的變化。
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
這篇文章主要為大家詳細介紹了Vue導(dǎo)出頁面為PDF格式，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
關(guān)于el-form表單驗證中的validator與validate使用時的問題
這篇文章主要介紹了關(guān)于el-form表單驗證中的validator與validate使用時的問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-06-06
vue中el-table和jsplumb實現(xiàn)連線功能
本文主要介紹了el-table和jsplumb實現(xiàn)連線功能，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07
這篇文章主要為大家詳細介紹了vue+elementUI實現(xiàn)簡單日歷功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-09-09
Vue-cli3 $ is not defined錯誤問題及解決
這篇文章主要介紹了Vue-cli3 $ is not defined錯誤問題及解決,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-07-07
本篇文章主要介紹了自定義vue組件發(fā)布到npm的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
這篇文章主要介紹了Vue 監(jiān)聽元素前后變化值實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
最近在做一個類似課程表的需求,需要自制一個日歷來支持功能及展現(xiàn),就順便研究一下應(yīng)該怎么開發(fā)日歷組件,下面這篇文章主要給大家介紹了關(guān)于如何基于vue2實現(xiàn)一個日歷組件的相關(guān)資料,需要的朋友可以參考下2022-12-12
這篇文章主要介紹了Element Card 卡片的具體使用，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
這篇文章主要介紹了vue中引入第三方字體文件的方法示例，文中講述了實現(xiàn)方法及其錯誤的解決，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12