ScrollTo内部useEffect react组件不工作

Question

渲染组件时，我正试图滚动到组件的顶部。我的代码如下：

const Terms = () => {

useEffect(() => {
window.scrollTo(0, 0);
console.log("effect rendered");
}, []);

return <>...</>

当我在两个组件之间切换时，它不会滚动到组件的顶部。即使console.log每次都按预期进行渲染，但不会进行滚动。

Answer 1

对我的问题有效的解决方案是：

useEffect(() => {
const element = document.getElementById('someId');
element.scrollIntoView();
}, []);
return (<div id="someId"> ... </div>)

感谢大家的想法！

Answer 2

我发现了一个对话，似乎你必须给你想滚动到的元素一个id：

react组件中的windowscrollTo((？

您的元素：

<div id="scroller">

const scrollToTop = () => {
document.getElementById("scroller").scroll(0,0)
}
<button onClick={scrollToTop}>Scroll to Top</button>

把scrollTop放在useEffect()里面，它应该可以工作了。