如何使用钩子/功能滚动到元素？

Question

我想再次问这个问题，但是现在问我如何使用函数/钩子来实现这一点。我尝试使用useRef，然后从current.offsetTop访问偏移量，但是在安装组件后，我一直在努力访问此ref。function ScrollComponent(props) {  const foo = false; //loading method  let resultsRef = useRef();  useEffect(() => {    window.scrollTo({      behavior: "smooth",      top: resultsRef.current.offsetTop    });  }, [resultsRef]);  if (foo)    return (      <div>        <h4>Loading...</h4>      </div>    );  return (    <div ref={resultsRef}>      <h4>content</h4>    </div>  );}在上面的示例中，我有一个名为foo的常量，不需要在内容加载时附加此滚动引用。但是，运行此代码时，我无法读取未定义的属性“ offsetTop”在我的useEffect方法中，我将依赖项指定为resultsRef，因此我希望仅在加载内容div时将resultRef被写入时才调用该依赖项，但是事实并非如此。