欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

關(guān)于Vue?"__ob__:Observer"屬性的解決方案詳析

 更新時(shí)間：2022年11月12日 15:11:39   作者：一個(gè)水瓶座程序猿.  
在操作數(shù)據(jù)的時(shí)候發(fā)現(xiàn),__ob__: Observer這個(gè)屬性出現(xiàn)之后,如果單獨(dú)拿數(shù)據(jù)的值,就會(huì)返回undefined,下面這篇文章主要給大家介紹了關(guān)于Vue?"__ob__:Observer"屬性的解決方案,需要的朋友可以參考下

問題描述

  • 我們操作 Vue 數(shù)據(jù)的時(shí)候，經(jīng)常會(huì)看到這個(gè)屬性: __ob__:Observer
  • 在我們操作這個(gè)數(shù)據(jù)的時(shí)候，如果想要單獨(dú)拿這個(gè)數(shù)據(jù)里面的值，就會(huì)返回 undefined
  • 經(jīng)過我在網(wǎng)上查找相關(guān)資料，發(fā)現(xiàn) __ob__:Observer 是 Vue 中一個(gè)非常重要的知識(shí)點(diǎn)

原因分析：

那么什么是數(shù)據(jù)對(duì)象的 __ob__ 屬性呢？

其實(shí) __ob__:Observer 這些數(shù)據(jù)，是 Vue 框架對(duì)數(shù)據(jù)設(shè)置的監(jiān)控器，一般是 不可以被枚舉 的

解決方案：

下面是我在網(wǎng)上查資料找的幾點(diǎn)解決方案，希望可以幫到大家：

第一種： __ob__: Observer 是 Vue 對(duì)數(shù)據(jù)監(jiān)控添加的屬性，如果想去掉可以采用對(duì)象賦值的方式。

舉個(gè)例子：Object.assign({ },this.owner)

擴(kuò)展知識(shí)：Object.assign() 方法將所有可枚舉和自有屬性從一個(gè)或多個(gè)源對(duì)象復(fù)制到目標(biāo)對(duì)象，返回修改后的對(duì)象。

第二種： 比如說 list 里面存放的就是那些帶有 __ob__:Observer 的數(shù)據(jù)，那么可以使用 JSON.parse(JSON.stringify(this.list)) 來進(jìn)行解決

第三種： 直接操作數(shù)據(jù)

// 將后端返回的數(shù)據(jù)，賦值給我們定義的變量
// 舉個(gè)例子：我們定義的變量叫做 tableData
this.tableData = res.data;  // 我們把后端返回的數(shù)據(jù)，賦值給我們的變量 this.tableData
如果我們是在控制臺(tái)輸出:  console.log(this.tableData.id)  // 就會(huì)返回 undefined
但是如果我們加上索引:  console.log(this.tableData[0].id)  // 就會(huì)得到我們想要的 id 了

 總結(jié)

到此這篇關(guān)于關(guān)于Vue "__ob__:Observer"屬性的解決方案的文章就介紹到這了,更多相關(guān)Vue "__ob__:Observer"屬性解決內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

  • 關(guān)于ElementUI自定義Table支持render

    關(guān)于ElementUI自定義Table支持render

    這篇文章主要介紹了關(guān)于ElementUI自定義Table支持render，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
    2022-10-10
  • Vue環(huán)境搭建+VSCode+Win10的詳細(xì)教程

    Vue環(huán)境搭建+VSCode+Win10的詳細(xì)教程

    這篇文章主要介紹了Vue環(huán)境搭建+VSCode+Win10,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
    2020-08-08
  • 最全vue的vue-amap使用高德地圖插件畫多邊形范圍的示例代碼

    最全vue的vue-amap使用高德地圖插件畫多邊形范圍的示例代碼

    這篇文章主要介紹了最全vue的vue-amap使用高德地圖插件畫多邊形范圍,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
    2020-07-07
  • Vue操作數(shù)組的幾種常用方法小結(jié)

    Vue操作數(shù)組的幾種常用方法小結(jié)

    本文主要介紹了Vue操作數(shù)組的幾種常用方法小結(jié),主要包括map、filter、forEach、find 和 findIndex 、some 和 every、includes、Array.from這幾種方法,感興趣的可以了解一下
    2023-09-09
  • vue使用canvas實(shí)現(xiàn)移動(dòng)端手寫簽名

    vue使用canvas實(shí)現(xiàn)移動(dòng)端手寫簽名

    這篇文章主要為大家詳細(xì)介紹了基于vue使用canvas實(shí)現(xiàn)移動(dòng)端手寫簽名，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2020-09-09
  • 全站最詳細(xì)的Vuex教程

    全站最詳細(xì)的Vuex教程

    vuex是一個(gè)專門為vue.js設(shè)計(jì)的集中式狀態(tài)管理架構(gòu)。這篇文章主要介紹了全站最詳細(xì)的Vuex教程,需要的朋友可以參考下
    2018-04-04
  • vue video和vue-video-player實(shí)現(xiàn)視頻鋪滿教程

    vue video和vue-video-player實(shí)現(xiàn)視頻鋪滿教程

    這篇文章主要介紹了vue video和vue-video-player實(shí)現(xiàn)視頻鋪滿教程，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
    2020-10-10
  • 詳解vue中引入stylus及報(bào)錯(cuò)解決方法

    詳解vue中引入stylus及報(bào)錯(cuò)解決方法

    這篇文章主要介紹了詳解vue中引入stylus及報(bào)錯(cuò)解決方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2017-09-09
  • 使用Vue3新特性構(gòu)建動(dòng)態(tài)表單的方法詳解

    使用Vue3新特性構(gòu)建動(dòng)態(tài)表單的方法詳解

    傳統(tǒng)的表單開發(fā)通常需要編寫大量的重復(fù)代碼,例如處理用戶輸入、驗(yàn)證數(shù)據(jù)、更新 UI 等等,為了簡化開發(fā),我們可以借助 Vue 3 的新特性,例如組合式 API 和 ref 對(duì)象,所以本文我們將一起學(xué)習(xí)如何使用 Vue 3 的新特性構(gòu)建一個(gè)更加靈活、可擴(kuò)展的動(dòng)態(tài)表單
    2024-06-06
  • element-UI el-table修改input值視圖不更新問題

    element-UI el-table修改input值視圖不更新問題

    這篇文章主要介紹了element-UI el-table修改input值視圖不更新問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2024-02-02

最新評(píng)論