1

my code copied from example: example:https://flowbite-svelte.com/components/carousel

`


<script>
    import { Carousel } from 'flowbite-svelte';
    let imageList = [
        {
            id: 0,
            name: 'Cosmic timetraveler',
            imgurl: '/images/carousel/cosmic-timetraveler-pYyOZ8q7AII-unsplash.webp',
            attribution: 'cosmic-timetraveler-pYyOZ8q7AII-unsplash.com'
        },
        {
            id: 1,
            name: 'Cristina Gottardi',
            imgurl: '/images/carousel/cristina-gottardi-CSpjU6hYo_0-unsplash.webp',
            attribution: 'cristina-gottardi-CSpjU6hYo_0-unsplash.com'
        },
        {
            id: 2,
            name: 'Johannes Plenio',
            imgurl: '/images/carousel/johannes-plenio-RwHv7LgeC7s-unsplash.webp',
            attribution: 'johannes-plenio-RwHv7LgeC7s-unsplash.com'
        },
        {
            id: 3,
            name: 'Jonatan Pie',
            imgurl: '/images/carousel/jonatan-pie-3l3RwQdHRHg-unsplash.webp',
            attribution: 'jonatan-pie-3l3RwQdHRHg-unsplash.com'
        },
        {
            id: 4,
            name: 'Mark Harpur',
            imgurl: '/images/carousel/mark-harpur-K2s_YE031CA-unsplash.webp',
            attribution: 'mark-harpur-K2s_YE031CA-unsplash'
        },
        {
            id: 5,
            name: 'Pietro De Grandi',
            imgurl: '/images/carousel/pietro-de-grandi-T7K4aEPoGGk-unsplash.webp',
            attribution: 'pietro-de-grandi-T7K4aEPoGGk-unsplash'
        },
        {
            id: 6,
            name: 'Sergey Pesterev',
            imgurl: '/images/carousel/sergey-pesterev-tMvuB9se2uQ-unsplash.webp',
            attribution: 'sergey-pesterev-tMvuB9se2uQ-unsplash'
        },
        {
            id: 7,
            name: 'Solo travel goals',
            imgurl: '/images/carousel/solotravelgoals-7kLufxYoqWk-unsplash.webp',
            attribution: 'solotravelgoals-7kLufxYoqWk-unsplash'
            }
    ];
</script>


<div class="max-w-4xl">
    <Carousel {imageList} />
</div>


error:

Cannot read properties of undefined (reading 'length')
TypeError: Cannot read properties of undefined (reading 'length')
    at eval (/node_modules/flowbite-svelte/carousels/Carousel.svelte:50:32)
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1876:22)   
    at eval (/src/routes/+page.svelte:62:125)
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1876:22)   
    at Object.default (root.svelte:41:38)
    at eval (/src/routes/+layout.svelte:26:67)
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1876:22)   
    at root.svelte:40:37
    at $$render (/node_modules/svelte/internal/index.mjs:1876:22)
    at Object.render (/node_modules/svelte/internal/index.mjs:1884:26)

`

i chceck with console.log imageList is array and has property leght i think this is some kind of bug in svelte when i randomly reload my website sometime code work propertly how i can debug this? i also tried

{#await promise}

but the same error

cc2
  • 11
  • 1

0 Answers0