我正在用Slick Slider创建一个滑块。问题是：当屏幕大小改变时，幻灯片的大小会减少或堆叠在一起。
Slick Slider提供：

responsive: [
        {
          breakpoint: 1024,
          settings: {
            slidesToShow: 3,
            slidesToScroll: 3,
            infinite: true,
            dots: true
          }, 
    …
      ]

字符串
但这并不能防止幻灯片大小的变化，也不能固定不断变化的幻灯片之间的余量。
我试探着：

.slick-slide {
  width: auto !important;
}

型
在CSS文件中，但随后幻灯片一个在另一个下面积累，生成4行而不是2行。此外，动画太大，在滑块的末尾创建了一个空白空间。
有没有可能创建一个带有幻灯片的滑块，无论窗口大小如何，都保持相同的大小和间距？一种保持固定幻灯片大小的方法，只显示屏幕上可能的幻灯片数量，只显示（或不显示）下面幻灯片的一部分？
以便也能响应。需要的内容：

下面是我的代码：

const settings = {
        rows: 2,
        slidesPerRow: 1,
        slidesToShow: 3.2,
        infinite: false,
        swipeToSlide: true,
        slidesToScroll: 1,
        lazyLoad: true,
        responsive: [
            {
              breakpoint: 1200,
              settings: {
                  slidesToShow: 2.5,
                  slidesToScroll: 2,
              }
            },
            {
                breakpoint: 1024,
                settings: {
                    slidesToShow: 2,
                    slidesToScroll: 2,
                }
            },
            {
                breakpoint: 768,
                settings: {
                    slidesToShow: 1.7,
                    slidesToScroll: 1,
                    arrows: false                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 1.4,
                    slidesToScroll: 1,
                    arrows: false
                }
            }
        ]

      };
     
      return (
        <>
          <h2>…</h2>
          <div className="cell">
            <Slider {...settings}>
                {
                    this.props.data.nodes.map((node,key) => (
                        <Cell node={node} key={key} />
                    ))
                } 
            </Slider>
          </div>
        </>
      );

型
谢谢你，谢谢