我正在嘗試將使用 axios 從我的 API 檢索到的資料加載到 vue.js 資料函式中。我已將該程序拆分為兩個函式，一個函式從我的 api 檢索資料并將其分配給一個變數，另一個函式應該對其進行操作。
不幸的是，當我在每個函式中記錄資料時，我得到了不同的結果。
這是我在做什么：
let sendGetRequest = async () => {
try {
console.log('getting');
const res = await axios.get('/api/v1/leaderboard');
let resData= res.data
this.pastWinners = resData.history
this.chart = resData.chart
console.log('this ', this.chart)
this.users = resData.users
} catch (err) {
console.error(err)
}
};
let objectManipulation = () => {
console.log('manipulating');
console.log(this.chart)
}
sendGetRequest();
objectManipulation();
第一個日志（來自sendGetRequest）回傳資料，因為它應該是：
(7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, __ob__: Observer]
而第二個函式回傳：
[__ob__: Observer]
length: 0
__ob__: Observer {value: Array(0), dep: Dep, vmCount: 0}
[[Prototype]]: Array
謝謝！
uj5u.com熱心網友回復：
感謝@daantje 的回答，我能夠解決這個問題。
為了解決它，我使用&sendGetRequest從內部呼叫，如下所示：objectManipulationasyncawait
let sendGetRequest = async () => {
try {
console.log('getting');
const res = await axios.get('/api/v1/leaderboard');
let resData= res.data
this.pastWinners = resData.history
this.chart = resData.chart
console.log('this ', this.chart)
this.users = resData.users
console.log('done')
} catch (err) {
console.error(err)
}
};
let objectManipulation = async () => {
// eslint-disable-next-line no-unused-vars
let res = await sendGetRequest()
console.log('manipulating');
console.log(this.chart)
}
objectManipulation();
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/400272.html
標籤：javascript 接口 Vue.js 公理
上一篇：大家好！我需要在螢屏上顯示API的第一個物件：http://dummy.restapiexample.com/api/v1/employees
下一篇：【JDBC】筆記（3）--- 提高用戶登錄功能的安全性 （javaSE+MySQL+JDBC）[ 應用 PreparedStatement ]