vue踩坑記錄:屬性報undefined錯誤問題
vue屬性報undefined錯誤
在一個組件里，通過props傳值進(jìn)去對象，在控制臺打印報錯誤信息，提示某屬性不存在。
例如：
<div>{{data.param.aaa}}</div>類似這種的，取對象子級下面的值，就報了undefined。
原因應(yīng)該是在初始傳值，最多默認(rèn) data={}。
我嘗試在props里設(shè)置好默認(rèn)值，但是依然報錯
這么設(shè)置的props：
props:{
? ? data:Object,
? ? default:function(){
? ? ? ?return {
? ? ? ? ? ? ?param:''
? ? ? ? }
? ? }
}這么設(shè)置，依然報錯。 這個報錯，應(yīng)該是在父組件初始化了 data={}導(dǎo)致的。
最終解決方法
<div v-if="data.param">{{data.param.aaa}}</div>加一個if判斷，就可以了。
vue之各種報錯問題
1 、undefined is not iterable!或者null is not iterable!"
null和undefine是不可以拿來循環(huán)的，拿來循環(huán)就會報上面這個錯誤，循環(huán)的時候判斷一下，不為null或者undefine的時候再拿來循環(huán)就可以了~~
2、Duplicate keys detected: ‘funs1’. This may cause an update error.
原因： key值不唯一
解決: 仔細(xì)檢查是否用了同一個數(shù)據(jù)循環(huán)且:key值相同，如果相同給第二個key隨便加一個標(biāo)記就可以，如下：
:key=“index + ‘-only’”
3、報錯內(nèi)容：Maximum call stack size exceeded
這個一般都是路由的堆棧溢出的原因
說白了就是你寫了死循環(huán)。
比如我的這個代碼哈：
/**
*ifManager 是否是管理員
*str 是否有用戶信息
*在路由跳轉(zhuǎn)之前判斷是否是管理員或者是否有用戶信息，如果沒有就跳轉(zhuǎn)到login頁面
*/
router.beforeEach((to, from, next) => {
if (ifManager || str) {
next()
} else {
next(false);
router.push('/login')
}
}）
/**
*乍一看好像沒有什么問題，但是一運行就會出現(xiàn)上面的那個錯誤，為什么呢。因為當(dāng)我們跳到login頁面的時候，依舊會判斷是否是管理員或者是否有用戶信息，就陷入了一個死循環(huán)。
*
*/
解決辦法就是：判斷條件改一下就可以了
fManager || str|| to.path == '/login'
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue安裝和使用scss及sass與scss的區(qū)別詳解
這篇文章主要介紹了vue安裝和使用教程，用了很久css預(yù)編譯器，但是一直不太清楚到底用的sass還是scss，直到有天被問住了有點尷尬，感興趣的朋友一起看看吧2018-10-10
vue在index.html中引入靜態(tài)文件不生效問題及解決方法
這篇文章主要介紹了vue在index.html中引入靜態(tài)文件不生效問題及解決方法，本文給大家分享兩種原因分析，通過實例代碼講解的非常詳細(xì) ,需要的朋友可以參考下2019-04-04
路由守衛(wèi)（Route?Guards）是?Vue?Router?的一個功能,它允許我們在路由發(fā)生之前執(zhí)行邏輯判斷,這篇文章主要為大家介紹了Vue中路由守衛(wèi)的具體應(yīng)用,需要的可以了解下2024-03-03
Element?Plus，由餓了么大前端團(tuán)隊開源出品的一套為開發(fā)者、設(shè)計師和產(chǎn)品經(jīng)理準(zhǔn)備的基于?Vue?3.0?的組件庫，Element?Plus是基于Vue3面向設(shè)計師和開發(fā)者的組件庫，提供了配套設(shè)計資源，幫助你的網(wǎng)站快速成型2022-12-12
這篇文章主要介紹了vue附件下載無法打開的問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-07-07
Vue3-新特性defineOptions和defineModel示例詳解
在Vue3.3中新引入了defineOptions宏主要是用來定義Option API的選項,可以用defineOptions定義任意的選項,props、emits、expose、slots除外,本文給大家介紹Vue3-新特性defineOptions和defineModel,感興趣的朋友一起看看吧2023-11-11
這篇文章主要為大家詳細(xì)介紹了基于canvas實現(xiàn)簡易的手寫簽名，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-05-05
這篇文章主要為大家介紹了Vue布置導(dǎo)航守衛(wèi)獲取用戶信息，有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
在Vue.js開發(fā)中,我們經(jīng)常需要創(chuàng)建可復(fù)用的組件,這些組件可能會有自己的樣式規(guī)則,而有時我們希望父組件能夠影響子組件的樣式,本文將詳細(xì)介紹如何使用v-deep以及一些相關(guān)的最佳實踐,需要的朋友可以參考下2024-10-10
這篇文章主要介紹了Vue項目移動端滾動穿透問題的實現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05