vue中渲染對象中屬性時顯示未定義的解決
更新時間：2020年07月31日 08:37:05 作者：拼搏到無能為力
這篇文章主要介紹了vue中渲染對象中屬性時顯示未定義的解決，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
后端給的對象結(jié)構(gòu)是這樣的，三層嵌套
而在最開始的時候我在data中定義了一個對象（dataInfo）接受了圖示所有的屬性
而在template中我要渲染數(shù)據(jù)（dataInfo.clientInfo.deviceName）
然后。。。。在這里插入圖片描述
未定義。。。作為一個前端菜雞，百思不得其解。
最終在有道的幫助下，告訴我了此屬性不在vue實例上
恍然大悟
只能解析在data中定義也就是vue實例上的對象子一層的東西，對于孫一層的東西就被解析成不在vue實例上的
兩種解決方法：
第一：
在定義的dataInfo中定義clientInfo等八個對象
第二：
直接定義八個對象接收八個對象中的東西
這樣，孫一層的東西就在vue實例上了
補充知識：vue報錯Cannot read property '_withTask' of undefined
控制臺報錯：
Cannot read property ‘_withTask' of undefined
原因：
template中的出現(xiàn)的綁定事件在methods中沒有定義
以上這篇vue中渲染對象中屬性時顯示未定義的解決就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
隨著前端技術(shù)的不斷發(fā)展,地圖應(yīng)用在我們的項目中越來越常見,本文將介紹如何在Vue3項目中集成高德地圖,并通過簡單的配置實現(xiàn)地圖的平移和縮放功能,需要的朋友可以參考下2024-09-09
詳解vue-router的導(dǎo)航鉤子(導(dǎo)航守衛(wèi))
這篇文章主要介紹了詳解vue-router的導(dǎo)航鉤子(導(dǎo)航守衛(wèi))，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11
elementUI動態(tài)嵌套el-form表單校驗舉例詳解
最近工作遇到個需求,表單可以進行增加刪除操作,需要進行表單校驗,這篇文章主要給大家介紹了關(guān)于elementUI動態(tài)嵌套el-form表單校驗的相關(guān)資料,文中通過圖文介紹的非常詳細,需要的朋友可以參考下2023-06-06
vue flex 布局實現(xiàn)div均分自動換行的示例代碼
這篇文章主要介紹了vue flex 布局實現(xiàn)div均分自動換行,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08
Vue3提供了一種組合式API,可以用來構(gòu)建可復(fù)用的組件和應(yīng)用程序,下面這篇文章主要給大家介紹了關(guān)于如何創(chuàng)建Vue3項目及組合式API的相關(guān)資料,文中通過圖文以及實例代碼介紹的非常詳細,需要的朋友可以參考下2023-05-05
這篇文章主要為大家詳細介紹了vue實現(xiàn)移動端可拖拽式icon圖標，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
vue?props使用typescript自定義類型的方法實例
這篇文章主要給大家介紹了關(guān)于vue?props使用typescript自定義類型的相關(guān)資料,文中通過實例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2023-01-01
文章描述了在使用官網(wǎng)命令創(chuàng)建Nuxt3項目時遇到的問題,通過分析命令,推測問題出在拉取項目模板失敗,解決方法是手動訪問并下載項目模板,解壓后按照官網(wǎng)教程安裝依賴并啟動,最終成功解決問題2024-12-12
父組件向子組件傳值的時候,子組件是通過props來接收的,然后以變量的形式將props傳遞到setup語法糖果中使用,本文給大家介紹vue3 setup語法糖之父子組件之間的傳值,感興趣的朋友一起看看吧2023-12-12
Vue局部組件數(shù)據(jù)共享Vue.observable()的使用
隨著組件的細化，就會遇到多組件狀態(tài)共享的情況，今天我們介紹的是 vue.js 2.6 新增加的 Observable API ，通過使用這個 api 我們可以應(yīng)對一些簡單的跨組件數(shù)據(jù)狀態(tài)共享的情況，感興趣的可以了解一下2021-06-06