是否有一种方法可以访问npm包内的方法?



我目前正在建立一个网站,我需要建立一个旋转木马。旋转木马需要有一个"进度条"作为当前幻灯片的指示器(如这里:https://www.samsung.com/uk)。

我熟悉react-responsive-carousel,但它没有内置的功能,为进度条

我已经使用state有效地构建了一个秒表,以方便组件内的进度条。

而不是使用内置的自动播放功能,从反应-响应-旋转木马,我想有一个功能,是触发一旦间隔完成移动到下一张幻灯片。

我遇到的问题是,我不确定如何触发这个动作。我已经检查了文档,看起来我需要触发onClickNext(参见这里的第528行),但是我不知道如何做到这一点。

如果有区别的话,我目前使用的是功能组件,而不是基于类的组件。我只需要了解如何从组件中触发该操作。

感谢

也许使用ref来触发该类组件内部的函数是可行的。

这似乎是你正在寻找的解决方案。

import { Carousel } from "react-responsive-carousel";
import "react-responsive-carousel/lib/styles/carousel.min.css";
import { useEffect, useRef } from "react";
const App = () => {
const myRef = useRef();
useEffect(() => {
setTimeout(() => {
if (myRef) myRef.current.onClickNext();
}, 2000);
}, []);
return (
<Carousel ref={myRef}>
<div>
<p>Slide 1</p>
</div>
<div>
<p>Slide 2</p>
</div>
</Carousel>
);
};
export default App;

相关内容

  • 没有找到相关文章

最新更新