Ant Design Carousel：如何访问goto()、Next()和Prev()方法

4dbbbstv 于 2022-10-15 发布在 Ant Design

关注(0)|答案(2)|浏览(1012)

我们在我们的项目中使用Ant Design，而我正在尝试使用他们的Carousel component。文档显示了方法goto(), next(), prev()，但我无法访问这些方法。我们对其他antD组件执行此操作的方式是：

const { goto, next, prev } = Carousel;

一旦您导入了Carousel，但这不起作用--这些方法都是未定义的。这些方法是exposed in this 2017 pull request(尽管原始的Pull请求引用了previous()而不是prev())，但我看不到访问它们的方法。这个PR还提到PR的目的是使方法可用，而不必使用Ref，这就是所有的SO示例似乎表明的是基于类的解决方案，而不是我们正在使用的Hooks。
我错过了什么吗？

reactjs

来源：https://stackoverflow.com/questions/58571588/ant-design-carousel-how-to-access-the-goto-next-prev-methods

2条答案

按热度按时间

axkjgtzd1#

如果你想使用Carousel的方法，你应该得到Carousel组件的示例。
像这样：codesandbox

赞(0）回复(0）举报 2022-10-15

ha5z0ras2#

您可以创建一个ref并将其传递给carousel，从那里您可以访问carousel方法。

const carouselRef = React.createRef();

 <Carousel dotPosition={dotPosition} ref={carouselRef}>
 <Button  onClick={() => {
       carouselRef.current.next();
     }}
 >
            goto next
          </Button>
  <Button
            onClick={() => {
              carouselRef.current.prev();
            }}
          >
            goto prev
          </Button>
</Carousel>

赞(0）回复(0）举报 2022-10-15

我来回答

Ant Design Carousel：如何访问goto()、Next()和Prev()方法

2条答案

相关问题

热门标签

最新问答