vue?watch報錯:Error?in?callback?for?watcher?"xxx":"TypeError的解決方法
一、問題
1.監(jiān)聽了一個data里面的對象竟然報錯了,錯誤還奇奇怪怪的:不能在 undefined上使用 apply方法
1)詳細(xì)錯誤如下:
vue.esm.js?9b69:5059 [Vue warn]: Error in callback for watcher "flowCategory": "TypeError: Cannot read properties of undefined (reading 'apply')"
found in
---> <FlowItem> at src/projects/comen/implemenceWorkstation/flowSetting/FlowItem.vue
<ElTabPane> at packages/tabs/src/tab-pane.vue
<ElTabs> at packages/tabs/src/tabs.vue
<View> at src/views/implemenceWorkstation/flowSetting/view.vue
<Index> at src/layout/index.vue
<App> at src/App.vue
<Root>
warn$2 @ vue.esm.js?9b69:5059
logError @ vue.esm.js?9b69:3728
globalHandleError @ vue.esm.js?9b69:3724
handleError @ vue.esm.js?9b69:3691
invokeWithErrorHandling @ vue.esm.js?9b6
2)代碼如下:
watch: { flowCategory: { hanlder(newval, oldval) { console.log('flowCategory', newval, oldval); }, deep: true } }
二、解決方法
1.是不是看著上面的代碼沒問題,我也是很自信,不就是在handler函數(shù)中打印了變化前后的值嗎?寫法就是這樣啊,我也是這樣自信。
2.找了半天發(fā)現(xiàn)自己 把 handler 這個單詞寫錯了 ,敲錯了寫成'hanlder“了,ide也沒有提示 &***&
改成下面這樣就可以了
watch: { flowCategory: { handler(newval, oldval) { console.log('flowCategory', newval, oldval); }, deep: true } }
3.現(xiàn)在終于明白報錯:是為了告訴我們handler出問題了,watch不知道監(jiān)聽到變化時要干什么。
三、總結(jié)
1.報上面這個錯誤表示handler函數(shù)寫的有問題。你可以檢查以下幾點(diǎn):
1)handler函數(shù)有沒有寫
2)handler有沒有拼寫正確(雖然有點(diǎn)愚蠢,但是我今天確實(shí)是因為這個……)
3)handler函數(shù)不能是箭頭函數(shù)(this指向變化后,apply也是有問題的)
2.啊,愚蠢的我。
到此這篇關(guān)于vue watch報錯:Error in callback for watcher “xxx“:“TypeError:Cannot read properties of undefined解決的文章就介紹到這了,更多相關(guān)vue watch報錯Error in callback for watcher “xxx“內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- Vue報錯:TypeError:?Cannot?create?property?‘xxxx‘?on的解決
- 完美解決vue中報錯?“TypeError:?Cannot?read?properties?of?null?(reading'forEach')“
- web前端Vue報錯:Uncaught?(in?promise)?TypeError:Cannot?read?properties?of?nu解決
- vue引入elementUi后打開頁面報錯Uncaught?TypeError的解決方式
- Vue報錯:TypeError:Cannot create property 'xxx' on string 'xxxx'問題
相關(guān)文章
關(guān)于IDEA中的.VUE文件報錯 Export declarations are not supported by cu
這篇文章主要介紹了關(guān)于IDEA中的.VUE文件報錯 Export declarations are not supported by current JavaScript version的問題,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-10-10vue實(shí)現(xiàn)簡易圖片左右旋轉(zhuǎn),上一張,下一張組件案例
這篇文章主要介紹了vue實(shí)現(xiàn)簡易圖片左右旋轉(zhuǎn),上一張,下一張組件案例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07Vue-axios-post數(shù)據(jù)后端接不到問題解決
這篇文章主要介紹了Vue-axios-post數(shù)據(jù)后端接不到問題解決,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01vue input輸入框關(guān)鍵字篩選檢索列表數(shù)據(jù)展示
這篇文章主要為大家詳細(xì)介紹了vue input輸入框關(guān)鍵字篩選檢索列表數(shù)據(jù)展示,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2019-05-05vue+element實(shí)現(xiàn)動態(tài)換膚的示例代碼
本文主要介紹了vue+element實(shí)現(xiàn)動態(tài)換膚的示例代碼,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09vue.js-div滾動條隱藏但有滾動效果的實(shí)現(xiàn)方法
下面小編就為大家分享一篇vue.js-div滾動條隱藏但有滾動效果的實(shí)現(xiàn)方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03