react-scroll链接呈现为文本且不可单击-平滑滚动不起作用

import { Link } from 'react-scroll';

/* 确保没有这样的样式 */
.scroll-link {
  pointer-events: none;
}

<Link to="section1" smooth={true} duration={500}>Go to Section 1</Link>

<div id="section1">Section 1</div>

import React from 'react';
import { Link, animateScroll as scroll } from 'react-scroll';

const App = () => {
  return (
    <div>
      <nav>
        <Link to="section1" smooth={true} duration={500}>Go to Section 1</Link>
        <Link to="section2" smooth={true} duration={500}>Go to Section 2</Link>
      </nav>
      <section id="section1">
        <h2>Section 1</h2>
        <p>This is section 1 content.</p>
      </section>
      <section id="section2">
        <h2>Section 2</h2>
        <p>This is section 2 content.</p>
      </section>
    </div>
  );
};

export default App;