vue中{__ob__: observer}對象轉(zhuǎn)化為數(shù)組進行遍歷方式
更新時間：2023年10月17日 09:04:07 作者：__十七
這篇文章主要介紹了vue中{__ob__: observer}對象轉(zhuǎn)化為數(shù)組進行遍歷方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
vue{__ob__: observer}對象轉(zhuǎn)化為數(shù)組進行遍歷
情況
在vue中，我們一般會將接口返回的數(shù)據(jù)，用一個變量進行接收，然后對這個變量進行一系列操作，比如取值，修改，遍歷，合并數(shù)組等
但是在這個情況中，會發(fā)現(xiàn)我們接收到的數(shù)據(jù)打印出來會是一個{ob: observer}這種形式的。
這個形式的數(shù)據(jù)是不能像數(shù)組進行遍歷的。
我們可以使用下面這種方式，可以得到一個正?？墒褂玫膶ο蠡蛘邤?shù)組啦
const newData = JSON.parse(JSON.stringify(data))
vue中 [__ob__: Observer]問題
__ob__: Observer這些數(shù)據(jù)是vue這個框架對數(shù)據(jù)設置的監(jiān)控器，一般都是不可枚舉的。
我就遇到了這種，在created中已經(jīng)賦值了，但在mounted中又沒有，或者有取不到值，
如下圖：
收了很多，有的說用JSON.parse(JSON.stringify(數(shù)組))再進行賦值但沒有用后面看來很多終于解決了
因為vue取值的方式是Ajax異步的，我們還沒取到值就開始用了，直接使用一個定時器就可以解決
mounted() {
setTimeout(()=>{
//這里就寫你要執(zhí)行的語句即可，先讓數(shù)據(jù)庫的數(shù)據(jù)加載進去數(shù)組中你在從數(shù)組中取值就好了
},800)
}總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
element vue Array數(shù)組和Map對象的添加與刪除操作
這篇文章主要介紹了element vue Array數(shù)組和Map對象的添加與刪除功能，本文給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2018-11-11
vue樹形結(jié)構(gòu)數(shù)據(jù)處理的方法總結(jié)
在項目開發(fā)的過程中,會經(jīng)常使用樹形結(jié)構(gòu)數(shù)據(jù),前后端交互都會對數(shù)據(jù)進行處理,后端返回的數(shù)據(jù)前端有的時候不能直接使用需要轉(zhuǎn)換,本文小編整理了一些項目中用到的處理方法,需要的朋友可以參考下2023-11-11
這篇文章主要為大家詳細介紹了Vue實現(xiàn)炫酷的代碼瀑布流背景，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-08-08
這篇文章主要為大家詳細介紹了vue+elemet實現(xiàn)表格手動合并行列，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-08-08
vue中實現(xiàn)點擊空白區(qū)域關閉彈窗的兩種方法
這篇文章主要介紹了vue中實現(xiàn)點擊空白區(qū)域關閉彈窗的兩種方法，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2020-12-12
這篇文章主要為大家詳細介紹Vue3中簡單diff算法的實現(xiàn)與使用，文中的示例代碼講解詳細，具有一定的借鑒價值，感興趣的可以了解一下2022-09-09
這篇文章主要介紹了vue中如何使用elementUI表格動態(tài)行合并，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
elementUI Tree 樹形控件單選實現(xiàn)示例
在ElementUI中樹形控件本身不支持單選功能,本文就來介紹一下如何實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2024-06-06
本文主要介紹了vue-element-admin下載到登錄的一些坑，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-04-04
watch函數(shù)用來偵聽特定的數(shù)據(jù)源,并在回調(diào)函數(shù)中執(zhí)行副作用,下面這篇文章主要給大家介紹了關于VUE3中watch監(jiān)聽使用的相關資料,需要的朋友可以參考下2022-06-06