vue中關(guān)于_ob_:observer的處理方式

更新時(shí)間：2022年07月31日 16:31:46 作者：JosiahH

這篇文章主要介紹了vue中關(guān)于_ob_:observer的處理方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

關(guān)于_ob_:observer的處理

在使用this.list.push()后，會(huì)出現(xiàn)_ob_:oberver這樣的對(duì)象。

網(wǎng)上很多地方說使用這個(gè)方法：

JSON.parse(JSON.stringify(this.list))

但是很多人試了沒用，他們可能是這么寫的

this.list=JSON.parse(JSON.stringify(this.list))
console.log(this.list)

但其實(shí)是這個(gè)是有用的，弄一個(gè)新變量再輸出

let nerArr = JSON.parse(JSON.stringify(this.List))

簡(jiǎn)而言之，如果碰到這種問題，不要使用data()里面定義的數(shù)據(jù)直接操作，要操作前，請(qǐng)先new一個(gè)對(duì)象

vue中[ob: Observer]問題

__ob__: Observer這些數(shù)據(jù)是vue這個(gè)框架對(duì)數(shù)據(jù)設(shè)置的監(jiān)控器，一般都是不可枚舉的。

我就遇到了這種，在created中已經(jīng)賦值了，但在mounted中又沒有，或者有取不到值，如下圖

收了很多，有的說用JSON.parse(JSON.stringify(數(shù)組))再進(jìn)行賦值但沒有用后面看來很多終于解決了

因?yàn)関ue取值的方式是Ajax異步的，我們還沒取到值就開始用了，直接使用一個(gè)定時(shí)器就可以解決

mounted() {
 setTimeout(()=>{
 //這里就寫你要執(zhí)行的語句即可，先讓數(shù)據(jù)庫(kù)的數(shù)據(jù)加載進(jìn)去數(shù)組中你在從數(shù)組中取值就好了
 },800)
 }

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Vue3中defineProps設(shè)置默認(rèn)值的方法實(shí)現(xiàn)
Vue3中我們經(jīng)常需要使用defineProps來定義組件的屬性,本文主要介紹了Vue3中defineProps設(shè)置默認(rèn)值的方法實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2024-07-07
詳解利用 Vue.js 實(shí)現(xiàn)前后端分離的RBAC角色權(quán)限管理
本篇文章主要介紹了利用 Vue.js 實(shí)現(xiàn)前后端分離的RBAC角色權(quán)限管理，非常具有實(shí)用價(jià)值，需要的朋友可以參考下
2017-09-09
vue-cli3跨域配置的簡(jiǎn)單方法
這篇文章主要給大家介紹了關(guān)于vue-cli3跨域配置的簡(jiǎn)單方法，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用vue-cli3具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
VUE 配置vue-devtools調(diào)試工具及安裝方法
vue-devtools是一款基于chrome瀏覽器的插件，用于vue應(yīng)用的調(diào)試，這款vue調(diào)試神器可以極大地提高我們的調(diào)試效率。幫助我們快速的調(diào)試開發(fā)vue應(yīng)用。這篇文章主要介紹了VUE 配置vue-devtools調(diào)試工具及安裝步驟 ,需要的朋友可以參考下
2018-09-09
uniapp和vue的區(qū)別詳解
這篇文章主要介紹了uniapp和vue的區(qū)別，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2021-10-10
vue.nextTick()與setTimeout的區(qū)別及說明
這篇文章主要介紹了vue.nextTick()與setTimeout的區(qū)別及說明,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-03-03
vue3項(xiàng)目typescript如何export引入(imported)的interface問題
這篇文章主要介紹了vue3項(xiàng)目typescript如何export引入(imported)的interface問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-06-06
sublime如何配置開發(fā)VUE環(huán)境自動(dòng)格式化代碼
這篇文章主要介紹了sublime如何配置開發(fā)VUE環(huán)境自動(dòng)格式化代碼問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-03-03
vue監(jiān)聽對(duì)象及對(duì)象屬性問題
這篇文章主要介紹了vue監(jiān)聽對(duì)象及對(duì)象屬性問題,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2018-08-08
Vue.js使用this.$confirm換行顯示提示信息實(shí)例
在編寫Web應(yīng)用時(shí),實(shí)現(xiàn)多行文本顯示通常需要用到HTML標(biāo)簽或JavaScript特定函數(shù),本文介紹了如何使用JavaScript的$createElement函數(shù)來創(chuàng)建多行文本顯示,$createElement可以創(chuàng)建任何HTML標(biāo)簽,使得在JavaScript中控制HTML輸出更加靈活,通過簡(jiǎn)單的代碼示例
2024-10-10