Question

我测试了我的React App，在我的视图中所有Link React Router dom都出错了。

Index.js

import {
 BrowserRouter as Router,
 Switch,
 Route
} from "react-router-dom";

function App({props}) {
 return (
  <div>
   <Navbar />
     <Switch>
      <Route path="/" exact component={Homepage} appProps={props}/>
      <Route path="/accueil" exact component={Homepage} appProps={props}/>
      <Route component={Error} />
    </Switch>
   <Footer />
  </div>
 );
}

ReactDOM.render(
 <Router>
  <App />
 </Router>,
 document.getElementById("fatboar")
);

Homepage.js

import { Link } from 'react-router-dom';

export default function Homepage(props) {
  return ( 
   <Link to="/ajouter-ticket" className="primary-btn mt-5">Je participe</Link>
  )
}

我的链接如何在路由器外部？

Answer 1

链接导航至 / ajouter-ticket ，从您的代码中可以看出，您从未将“通往该链接的路线”放置在此位置，因此您可以导航到“错误组件” 如果您阅读了react-router-dom文档您会看到，当您导航到“切换路线”中未定义的内容时，请转到“没有路径的路线” React Router Dom Doc

<Route path="/ajouter-ticket" exact component={SomeComponent} appProps={props}/>

还要为什么还要路由到首页？

路由器外链接

1 个答案: