Vue.js使用axios動(dòng)態(tài)獲取response里的data數(shù)據(jù)操作
今天開(kāi)發(fā)時(shí)，使用axios返回的response中data有多個(gè)數(shù)據(jù)：
如果是獲取cn里的數(shù)據(jù)的，可以用：
response.data.cn
但是需求是根據(jù)選擇來(lái)獲取數(shù)據(jù)的，會(huì)發(fā)生變化，最開(kāi)始的想法是，用一個(gè)變量來(lái)記錄需要獲取的key:
假設(shè)need是需要獲取的某個(gè)key
const dkey = this.need;
response.data.dkey
這樣發(fā)現(xiàn)獲取不到數(shù)據(jù)，這是因?yàn)関ue.js把dkey當(dāng)成data里的某一個(gè)key了，類似于上面的"cn"。
折騰了很久才突然想起，這個(gè)data其實(shí)類似一個(gè)數(shù)組，我們可以像使用數(shù)組一樣使用它，后面發(fā)現(xiàn)的確是可行的
const dkey = this.need;
response.data[dkey]
如果有說(shuō)得不對(duì)或者有更好的方法，希望大家指教。
補(bǔ)充知識(shí)：Vue遍歷data中某個(gè)字段，并累加、算總數(shù)，總計(jì)(this.list.forEach方法實(shí)戰(zhàn))
直接上代碼，遍歷data中prodAllPrice，并累加、算總數(shù)，總計(jì)(this.list.forEach方法實(shí)戰(zhàn))：
//定義
let sum = 0;
this.list.forEach((item) => {
//遍歷prodAllPrice這個(gè)字段，并累加
sum += item.prodAllPrice;
});
//返回
this.sum = sum;
以上這篇Vue.js使用axios動(dòng)態(tài)獲取response里的data數(shù)據(jù)操作就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
最近在學(xué)習(xí)vue的源碼，總結(jié)了幾種vue中父子組件傳遞數(shù)據(jù)的方法。具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-05-05
這篇文章主要介紹了vue element和nuxt的使用技巧分享，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2021-01-01
vue嵌套路由與404重定向?qū)崿F(xiàn)方法分析
這篇文章主要介紹了vue嵌套路由與404重定向?qū)崿F(xiàn)方法,結(jié)合實(shí)例形式分析了vue.js嵌套路由與404重定向的概念、原理、實(shí)現(xiàn)步驟與相關(guān)操作技巧,需要的朋友可以參考下2018-05-05
這篇文章主要介紹了如何使用 vue + d3 畫(huà)一棵樹(shù),本文通過(guò)文字說(shuō)明加代碼分析的形式給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2018-12-12
詳解如何在Vue2中實(shí)現(xiàn)useDraggable
這篇文章主要為大家詳細(xì)介紹了Vue2中實(shí)現(xiàn)useDraggable的相關(guān)知識(shí),文中的示例代碼簡(jiǎn)潔易懂,對(duì)我們深入了解vue有一定的幫助,需要的小伙伴可以參考下2023-12-12
Vue3中reactive函數(shù)toRef函數(shù)ref函數(shù)簡(jiǎn)介
這篇文章主要介紹了Vue3中的三種函數(shù)，分別對(duì)reactive函數(shù)toRef函數(shù)以及ref函數(shù)原理及使用作了簡(jiǎn)單介紹，有需要的朋友可以借鑒參考下2021-09-09
Vue?3中引入了組合式函數(shù)編程方式，可以更好地實(shí)現(xiàn)代碼的復(fù)用和可維護(hù)性。通過(guò)定義可組合的函數(shù)，可以將組件的邏輯和狀態(tài)進(jìn)行拆分和組合，實(shí)現(xiàn)更靈活的代碼組織方式。同時(shí)，組合式函數(shù)也支持響應(yīng)式數(shù)據(jù)和生命周期鉤子函數(shù)，更加貼近Vue開(kāi)發(fā)的實(shí)際場(chǎng)景2023-05-05
這篇文章主要為大家詳細(xì)介紹了Vue filters過(guò)濾器的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
vue實(shí)現(xiàn)簡(jiǎn)單圖片上傳功能
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)簡(jiǎn)單圖片上傳功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要介紹了vue3的api解讀之ref和reactive詳解，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-05-05