我有一個從 API 獲取資料的 nuxt 3 應用程式。我想使用該資料填充模板中的輸入欄位,但我一直收到錯誤訊息。
這是我的代碼片段
<script setup>
const config = useRuntimeConfig();
const route = useRoute();
const router = useRouter();
const { data: pkg } = useFetch(
() => '/api/id/1/'
);
const request = ref({
field: pkg.value.field_value,
});
當我console.log(pkg.value.field_value)在瀏覽器開發人員工具控制臺選項卡上列印值但在硬重繪 時,我收到錯誤Cannot read properties of null (reading 'field_value')
我需要動態設定欄位值的原因是為了能夠更新它。
以前有人遇到過這個問題,你是如何解決的
uj5u.com熱心網友回復:
添加await到useFetch函式中,因為在第一次渲染時pkg不可用:
<script setup>
const config = useRuntimeConfig();
const route = useRoute();
const router = useRouter();
const { data: pkg } = await useFetch(
() => '/api/id/1/'
);
const request = ref({
field: pkg.value.field_value,
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/534785.html
標籤:vue.jsvue.js3vue-组合-apinuxtjs3vue-脚本设置
上一篇:SQL2008中的回圈
下一篇:組件作為插槽內容Vue3
