使用react做一个页面滚动的效果

const Scroll = ({ children, style }) => {
  const container = useRef(null);
  useEffect(() => {
    const Interval = setInterval(() => {
      let element = container.current;

      let hScrollTop = element.scrollTop;
      let hScrollHeight = element.scrollHeight;
      let height = element.offsetHeight;

      if (height + hScrollTop >= hScrollHeight) {
        //滚动条已经到了容器底部
        element.scrollTop = 0;
        console.log(hScrollTop + ' ' + hScrollHeight + ' ' + height);
      } else {
        let h = hScrollTop + height;
        element.scrollTop = h;
      }
    }, 5000);
    return () => clearInterval(Interval);
  }, []);

  return (

    <div ref={container} style={{ ...style, overflowY: 'scroll' }}>
      {children}
    </div>
  );
};