problem with responsive when mounting the component

[lucaspieran]

When im in responsive mode this add a translate x value in slick-list and should be 0

  const settings = {
    slidesToShow: 5,
    slidesToScroll: 1,
    speed: 500,
    arrows: false,
    infinite: false,
    responsive: [
      {
        breakpoint: 1300,
        settings: {
          slidesToShow: 2,
          slidesToScroll: 1,
        },
      },
      {
        breakpoint: 1600,
        settings: {
          slidesToShow: 3,
          slidesToScroll: 1,
        },
      },
    ],
  }

only after touching next or prev does it look good

[mikosenpl]

I have the same problem, my settings (The problem is not caused by the sliderToShow type other than Integer)

  const settings = {
    slidesToShow: 4,
    slidesToScroll: 1,
    accessibility: true,
    infinite: false,
    nextArrow: <NextArrow />,
    prevArrow: <PreviousArrow />,
    responsive: [
      {
        breakpoint: 1024,
        settings: {
          slidesToShow: 3.2,
          slidesToScroll: 3,
        },
      },
      {
        breakpoint: 600,
        settings: {
          slidesToShow: 2.2,
          slidesToScroll: 1,
          dots: true,
        },
      },
      {
        breakpoint: 480,
        settings: {
          slidesToShow: 1.2,
          slidesToScroll: 1,
          dots: true,
        },
      },
    ]}

[jui9266]

Hi, I think it is because you render slider before data is fetched. How about rendering slider when you have data?