0

我正在网上关注如何使用 react-scroll 的教程，但我似乎无法让它为我工作

我正在使用 react-scroll 中的 Link 标签并将“to”属性设置为我想要滚动到的 div 的 id。但是当我查看实时代码时，我拥有的链接呈现为文本并且似乎无法点击。

import { Link } from "react-scroll";

const OpenBlurb = () => {
  return (
    <div className="blurb-container">
      <h1>Welcome</h1>
      <Link to="projects" smooth={true} duration={500} offset={50}> My Projects </Link>
    </div>
  );
};

export default OpenBlurb;

我希望“我的项目”链接将页面向下平滑滚动到 ID 为“项目”的另一个组件

const SecondSection = () => {
  return (
    <div className="second-container" id="projects" >
      <h2>My Projects</h2>

    </div>
  );
};

export default SecondSection;

谁能看到我做错了什么？

4

1 回答 1

0

我猜“项目”没有被标识为 ID。

您是否尝试过使用 to="#projects"？

看看这些，它们可能会有所帮助：

如何滚动到一个元素？

反应滚动 | 单击导航栏链接时如何滚动到特定的目标组件

于 2021-11-23T10:47:20.020 回答