此代碼顯示來自 Youtube api 回應的影像。（不要關心我在這里顯示的鍵和值，因為我使用 .map 操作 Youtube api 結果）。
我想在 Vuejs v-for 回圈之外顯示一些值（頻道標題和影像）。
<p v-cloak class="title">{{ ytitems[0].channelTitle}}</p>
<div class="mainImg">
<img v-bind:src="ytitems[thisindex].thumbnailHQ">
</div>
我得到這個 javascript 錯誤：TypeError: Cannot read properties of undefined (reading 'thumbnailHQ');
我嘗試了出現在某些論壇或此處但沒有成功的 v-if= 或 v-text。
<p v-cloak class="title">{{ ytitems[0].channelTitle}}</p>
OR
v-text="ytitems[0].providerName"></p>
thumbnailHQ 和頻道標題將顯示，但這會導致錯誤，并且其他一些 javascript 函式將停止作業。
我從安裝的 Vue 內的 Youtube api 獲取 json 檔案。
當我第一次在我的服務器上使用靜態 json 檔案進行測驗時，沒有錯誤，因為延遲為零，如何延遲或有任何 vue 方法來阻止我不知道的這個錯誤？
就像我說的，影像和標題最終出現了這些錯誤，但這些錯誤破壞了我代碼中的其他 javascript 函式。我通常使用 fetch 和一些 then 并且 v-for 回圈正常作業。
在已安裝的內部，我獲取 youtube api，然后獲取結果并將其映射到我制作的自定義函式
.then(res => {
this.ytitems = youtubeParser(res);
我用 v-for 顯示，一切都很好。
v-for="(item, index) in ytitems" :key="item.id"
來自我需要的其他資料的新 Vue 資料。我使用 vue.js 3。
data: {
// otherdata: 'example',
thisindex: 0,
ytitems: [],
}
uj5u.com熱心網友回復：
您可以只使用v-if來檢查是否ytitems[thisindex]存在。
<img v-if="ytitems[thisindex]" :src="ytitems[thisindex].thumbnailHQ">
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/508665.html