github:https://github.com/alvarotrigo/react-fullpage
import ReactFullpage from '@fullpage/react-fullpage';
获取fullpage对象
const fullPageRef = useRef<any>()
手动滚动到第page页
function onScrollTo(page:number){
fullPageRef.current.moveTo(page)
}
<ReactFullpage
credits={{
enabled:true,
label:'',
position: "left"
}}
//fullpage options
licenseKey = {'YOUR_KEY_HERE'}
scrollingSpeed = {1000} /* Options here */
scrollHorizontally = {true} /* Because we are using the extension */
scrollHorizontallyKey = {'YOUR KEY HERE'}
render={({ state, fullpageApi }) => {
fullPageRef.current = fullpageApi
return (
<ReactFullpage.Wrapper>
<div className="section">
<FirstPage onScrollNext={onScrollTo}/>
</div>
<div className="section">
<SecondPage onScrollNext={onScrollTo}/>
</div>
<div className="section">
<ThirdPage onScrollNext={onScrollTo}/>
</div>
</ReactFullpage.Wrapper>
);
}}
/>