Nuxt выдает ошибку пустой строки из JSON при сборке. Как исправить?

Пример моей страницы, где я в цикле вызываю json, который мне отдают иногда пустые строки, на это ругается Nuxt при сборке. Как это исправить?

Ошибка при сборке:

500 input must be a string (received string: "")

Код страницы:

<template>
    <NuxtLayout name="main">

        <!-- ---------- HERO ---------- -->
        <Hero>

            <Nav />

            <Grid class="sponsors">
                <Img v-for="prop in home" :src="prop.sponsors" :width="300" />
            </Grid>

            <h1 class="font-title">
                <span class="title">Крым</span>
                <br>
                <span class="subtitle">Зеркало истории</span>
            </h1>

            <Btn :to="'#films'" :text="'Смотреть сериал'" />

        </Hero>
        <!-- ---------- /HERO ---------- -->

        <!-- ---------- GALLERY ---------- -->

        <!-- ---------- /GALLERY ---------- -->



    </NuxtLayout>
</template>




<script setup>
const { data: home } = await useFetch(useRuntimeConfig().public.api + '/home')
useHead({
    title: home.value[0].title,
    meta: [{ name: "description", content: home.value[0].desc }]
})
</script>

JSON:

[
{
"title": "Film",
"desc": "Film desc",
"sponsors": "sponsors/culture-fond_ftl1iu_nhpivj.png",
"films": "film 1"
},
{
"title": "",
"desc": "",
"sponsors": "sponsors/muzey-tavrida-bw_wedmvw_qf4ixd.png",
"films": "film 2"
},
{
"title": "",
"desc": "",
"sponsors": "sponsors/insightstudio-logo-white_rc0vme.png",
"films": "film 3"
},
{
"title": "",
"desc": "",
"sponsors": "",
"films": "film 4"
},
{
"title": "",
"desc": "",
"sponsors": "",
"films": "film 5"
},
{
"title": "",
"desc": "",
"sponsors": "",
"films": "film 6"
}
]

Как игнорировать ошибку и просто продолжить цикл? Или как удалить пустые строки при получении JSON?

И использую Nuxt 3.4.1


Ответы (0 шт):