sectionRefCallback函数用作ref回调函数，用于捕获每个section元素的引用。这确保sectionsRef.current数组始终包含对所有节的最新引用。

import React, { useEffect, useRef } from 'react';

const ScrollToNextSection = () => {
  const sectionsRef = useRef([]);
  const activeIndexRef = useRef(0);
  
  useEffect(() => {
    const sections = sectionsRef.current;
    const activeIndex = activeIndexRef.current;

    const handleScroll = () => {
      const scrollPosition = window.scrollY || window.pageYOffset;

      if (scrollPosition >= sections[activeIndex].offsetTop + sections[activeIndex].offsetHeight) {
        scrollToNextSection();
      }
    };

    const scrollToNextSection = () => {
      if (activeIndex < sections.length - 1) {
        activeIndexRef.current = activeIndex + 1;
        sections[activeIndexRef.current].scrollIntoView({ behavior: 'smooth' });
      }
    };

    window.addEventListener('scroll', handleScroll);

    return () => {
      window.removeEventListener('scroll', handleScroll);
    };
  }, []);

  const sectionRefCallback = (section) => {
    if (section && !sectionsRef.current.includes(section)) {
      sectionsRef.current.push(section);
    }
  };

  return (
    <>
      <section ref={sectionRefCallback}>Section 1</section>
      <section ref={sectionRefCallback}>Section 2</section>
      <section ref={sectionRefCallback}>Section 3</section>
    </>
  );
};

export default ScrollToNextSection;