带有行的 React-slick 或 Nuka 旋转木马

Question

我刚开始学习 ReactJS，不得不将现有模板移植到 ReactJS 模板。目前我无法在 react-slick 中实现行。自 2015 年以来，我看到很多人提出这个要求，但没有得到答复。即使是与 Slick-Carousel 由同一作者专门为 ReactJS 创建的新 Nuka Carousel，也没有实现对行的支持。

在 react-slick 或 nuka-carousel 中设置行的最佳解决方法是什么？

Answer 1

这个问题发布已经有一段时间了，但是 React-Slick 现在支持多行作为可配置设置，键为 slidesPerRow 和行见 here.

export default class MultipleRows extends Component {
  render() {
    const settings = {
      rows: 2,
      slidesPerRow: 2
    };
    return (
      <div>
        <Slider {...settings}>
          <div>
            <h3>1</h3>
          </div>
          <div>
            <h3>2</h3>
          </div>
          <div>
            <h3>3</h3>
          </div>
          <div>
            <h3>4</h3>
          </div>
        </Slider>
      </div>
    );
  }
}

带有行的 React-slick 或 Nuka 旋转木马

React-slick or Nuka carousel with rows

reactjs

slick.js

react-slick