業(yè)務場景:進入一個頁面后,需要發(fā)起請求去獲取數(shù)據(jù)。比如進入用戶詳情頁面,頁面需要展示username,age等數(shù)據(jù),但這些數(shù)據(jù)需要發(fā)起一個請求去拿到。在模板中通過{{userInfo.username}}這種方式獲取。實現(xiàn)這個操作我的思路是:在對應的組件創(chuàng)建或者掛載時觸發(fā)一個action,通過這個action發(fā)起請求,action拿到數(shù)據(jù)后賦值進state,在組件中可以通過getter拿到state中對應的數(shù)據(jù).通過上述方法實現(xiàn)會遇到一個問題:運行時會報出這樣的錯誤:[Vue warn]: Error when rendering component <app-header>:
Uncaught TypeError: Cannot read property 'username' of null我理解錯誤原因是:組件在請求還沒有拿到數(shù)據(jù)的時候就會渲染,當渲染{{userInfo.username}}時,其實userInfo還是null.所以現(xiàn)在就產(chǎn)生了幾個問題:1.項目中使用Vuex,是不是組件中需要的數(shù)據(jù)都需要通過getter從state中獲取,包括一些通過請求拿到的數(shù)據(jù)?2.如果上述是正確的話,那么遇見例子中報錯的情況應該怎么處理?3.如果不正確,那么對于這種 組件渲染時需要的數(shù)據(jù)還沒拿到 情況要怎么處理?
2 回答

12345678_0001
TA貢獻1802條經(jīng)驗 獲得超5個贊
既然使用了Vuex,最好還是通過getter去獲取比較好。
對于例子中的報錯,我認為可以在組件初始化時,給userInfo一個非空賦值(比如{})。這樣就不會導致頁面報錯。
添加回答
舉報
0/150
提交
取消