React 路由是 React 应用中用于管理页面跳转和导航的机制。它允许你在不同的组件之间进行切换,而无需重新加载整个页面。React Router 是一个流行的路由库,提供了强大的路由功能。
原因:
react-router-dom
。<BrowserRouter>
或 <HashRouter>
包裹应用。解决方法:
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Home from './Home';
import About from './About';
function App() {
return (
<Router>
<Switch>
<Route exact path="/" component={Home} />
<Route path="/about" component={About} />
</Switch>
</Router>
);
}
npm install react-router-dom
import { BrowserRouter as Router } from 'react-router-dom';
function App() {
return (
<Router>
{/* 应用的其他部分 */}
</Router>
);
}
import { Link } from 'react-router-dom';
function Navbar() {
return (
<nav>
<Link to="/">Home</Link>
<Link to="/about">About</Link>
</nav>
);
}
通过以上步骤,你应该能够解决 React 路由未导航的问题。如果问题仍然存在,请检查控制台是否有错误信息,并根据错误信息进一步调试。
领取专属 10元无门槛券
手把手带您无忧上云