我有兩頁 - 書籍和書籍。單擊“書籍”頁面中的單個專案后，我試圖在我的“書籍”頁面上顯示一些資料。
我設法獲取了 JSON 檔案，該檔案列出了 Books 頁面上的所有專案以及通過 id 導航到 Book 頁面的鏈接。
我面臨的問題是我無法在 Book 頁面上獲取 JSON 回傳的資料。資料被隱藏，但 console.log(response.data) 在控制臺上顯示回應資料沒有問題。
這是來自 Books 頁面的路由鏈接，可導航單個 Book：
<router-link :to="'/books/' book.id"> Link </router-link>
這是我的 Book 組件腳本
<script>
import LibraryDataService from "../services/LibraryDataService";
export default {
name: "Book",
data() {
return {
book: "",
};
},
methods: {
getBook(id) {
LibraryDataService.get(id)
.then((response) => {
this.book = response.data;
console.log(response.data);
})
.catch((e) => {
console.log(e);
});
},
},
mounted() {
this.getBook(this.$route.params.id);
},
};
</script>
任何幫助將不勝感激
uj5u.com熱心網友回復：
嘗試等待回應：
async mounted() {
await this.getBook(this.$route.params.id);
},
uj5u.com熱心網友回復：
我已經能夠通過將 getBook 方法上的 response.data 修改為 this.book = response.data[0]; 來解決這個問題。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/397819.html
下一篇：通過索引動態洗掉另一個內部的陣列