所以基本上我想要一个滚动视图并通过滚动或单击链接从标题页导航到关于等。我正在尝试使用 react-scroll 包,但由于某种原因,我没有可滚动的视图并且链接不起作用!我所能看到的 - 主屏幕,所有组件都在同一页面上!
应用程序.js
import './App.css';
import Header from "./Header/Header";
import About from "./About/About";
import Projects from "./Projects/Projects";
import Footer from "./Footer/Footer";
function App() {
return (
<div className="App">
<Header/>
<About/>
<Projects/>
<Footer/>
</div>
);
}
export default App;
页眉.js
import React from 'react'
import {Link} from 'react-scroll'
function Header () {
return(
<div>
<Link activeClass="active"
to="about"
spy={true}
smooth={true}
offset={0}
duration={500}
>
About
</Link>
<Link activeClass="active"
to="projects"
spy={true}
smooth={true}
offset={0}
duration={500}
>
Projects
</Link>
<Link activeClass="active"
to="footer"
spy={true}
smooth={true}
offset={0}
duration={500}
>
Footer
</Link>
</div>
);
}
export default Header;
关于.js
import React from 'react'
function About () {
return (
<section id="about">
<div>
<h1>About</h1>
</div>
</section>
);
}
export default About;
Whould be great if someone can help and tell me what am I missing here!