我有一個問題，我看不到陣列里面的資料，我已經把資料推到里面了。然后從 axios
這是來自 vue.js 的示例代碼 Axios
export default {
name: 'facts',
data(){
const test = [{id: 'test',name: 'test'}]
const response = [];
const factsData = () => {
axios.get('http://localhost:3000').then(x=>response.push(x.data))
}
factsData();
console.log(response)
return{
test,
response
};
}
};
當我嘗試在 promise(.then) 中 console.log 輸出資料時，它運行良好并顯示我期望的資料
這就是當我嘗試將資料從 axios 推送到回應并使用上面的當前代碼在 console.log 中顯示輸出資料時發生的情況
當我嘗試訪問它（console.log（response [0]）時，它在console.log 中顯示未定義。
但奇怪的是，當我回到我之前的代碼以不嘗試訪問資料并在控制臺瀏覽器中展開陣列時，它顯示了我預期的資料，這意味著我無法訪問它。
主要目的是我想使用 v-for 顯示要在表中呈現的資料
<template>
<div >
<center>
<table>
<thead>
<tr>
<th></th>
<th>ID</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr v-for="(user,index) in test" :key="user.id">
<td>{{index 1}}</td>
<td>{{user.id}}</td>
<td>{{user.name}}</td>
</tr>
</tbody>
</table>
</center>
</div>
</template>
請告訴我我錯過了什么。謝謝你。
PS：我是這個 vue js 的新手
uj5u.com熱心網友回復：
你的代碼結構不正確。使用此代碼：
export default {
name: 'ProfilePage',
data() {
return {
response: []
}
},
created () {
this.getData();
},
methods: {
getData() {
axios.get('http://localhost:3000').then(x => this.response = x.data);
}
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/462297.html