React Swiper: Unable to add dynamic SwiperSlides

[alikleitcr7]

I'm trying to append SwiperSlide through an array in react, The slides are not being rendered. My code:

// array 

const slides = new Array(4)

// render

<Swiper
            
    navigation={{
        prevEl: this.prevNavRef.current,
        nextEl: this.nextNavRef.current,
    }}
    pagination={{
        clickable: true,
    }}
    onBeforeInit={(swiper) => {
        swiper.params.navigation.prevEl = this.prevNavRef.current;
        swiper.params.navigation.nextEl = this.nextNavRef.current;
    }}
>

   {/*  not rendering */}
    {
        slides.map((k, idx) => <SwiperSlide key={`slides-${idx}`} ></SwiperSlide>)
    }

<SwiperSlide>
     some slide, this is working
 </SwiperSlide>

</Swiper>

swiper version 6.8.1

Any idea how to render the slides based on the array?

[alikleitcr7]

fixed by filling the array with values! 👍