在React中使用fullpage.js

import React, { Component } from 'react';
import ReactFullpage from '@fullpage/react-fullpage';

class FullpageExample extends Component {
  render() {
    return (
      <ReactFullpage
        // 设置fullpage.js的选项
        options={{
          anchors: ['section1', 'section2', 'section3'],
          navigation: true,
          navigationPosition: 'right',
        }}
        // 定义每个屏幕的内容
        render={({ state, fullpageApi }) => {
          return (
            <div id="fullpage-wrapper">
              <div className="section section1">
                <h1>Section 1</h1>
              </div>
              <div className="section section2">
                <h1>Section 2</h1>
              </div>
              <div className="section section3">
                <h1>Section 3</h1>
              </div>
            </div>
          );
        }}
      />
    );
  }
}

export default FullpageExample;