slider show blank screen on Mobile View for the first time in map function.

[Rvi851994]

`const settings = { dots: true, infinite: false, speed: 500, slidesToShow: 4, slidesToScroll: 1, initialSlide: 0, responsive: [ { breakpoint: 1024, settings: { slidesToShow: 3, slidesToScroll: 1, infinite: true, dots: true, }, }, { breakpoint: 767, settings: { slidesToShow: 2, slidesToScroll: 1, initialSlide: 2, }, }, { breakpoint: 480, settings: { slidesToShow: 2, slidesToScroll: 1, }, }, ], };

<Slider {...settings}> {featureCars && featureCars.length > 0 && featureCars.map((item) => (

{item.car_make} {' '} {item.car_model} {' '} - {item.model_year}

{item.currency_icon} {item.price.toLocaleString()}

              ))}

` https://www.loom.com/share/85b20faaad3f4855b621fb1bee46021c?focus_title=1&muted=1&from_recorder=1

please check the video and let me know why is not working on mobile view properly?

[hug963]

I have the same issue, I just updated to the latest version, it was not happening before on 0.26.1 It is not happening consistently on all sliders on the same page.

The slider which has the issue seems to not be initialised properly, and no initial slide is selected (The back arrow is not disabled and the track is offset at load with a css transform)

It might some kind of racing conditions, I have two sliders on the same page, one works intermittently on mobile, the other not at all anymore.

[hug963]

I fixed it by placing the whole carousel in a conditional bracket to wait for the data to be fetched. I realised the sliders with the issue were initialised with no initial data.

[Rvi851994]

Yes hug963 you were right I already fixed that but thank you.