javascript - 如何滚动到 React 中的某个组件？

Question

我想知道如何滚动到组件而不是立即查看组件

所以我的概述组件中有以下内容

<a className="more-text group" href="#about">
     <h3 className="title">+ </h3>
     <h3 className="title">learn more</h3>
</a>

该组件保留在我的 Home 组件中

class Home extends React.Component {
    render() {
        return (
            <div>
                {/* Header */}
                <Header />

                {/*Overview Component*/}
                <Overview />

                {/* About Component*/}
                <About />

                {/*Footer Component*/}
                <Footer />
            </div>
        );
    }
}

Answer 1

我发现您想通过 url 哈希参数来实现此目的，因此，只需将 id 分配给您的组件，然后在需要滚动时更改 url。

<Header />

{/*Overview Component*/}
<Overview id="overview" />

{/* About Component*/}
<About id="about" />

{/*Footer Component*/}
<Footer id="footer" />