reactjs - 反应路由器。如何完全更改链接中的网址？

Question

我在带有 URL: 的页面上，http://localhost:3000/courses/32我想从这个地方将我的页面重定向Link到这个 URL: http://localhost:3000/categories。

标签： reactjsreact-router

Answer 1

你可以在这里找到一个小例子https://codesandbox.io/s/optimistic-wood-ug9oc，你需要先设置你的路由器，下面你可以找到应该使用Link和另一个使用的例子withRouter：

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

const Category = () => {
  return <div>Category</div>;
};

const CategoryWithRouter = withRouter(({ history }) => (
  <div
    onClick={() => {
      history.push("/category");
    }}
  >
    Category withRouter
  </div>
));

const Home = () => {
  // Link case
  // withRouter case as well
  return (
    <div>
      Home
      <Link to="/category">Category</Link>
      <CategoryWithRouter />
    </div>
  );
};

export default function App() {
  return (
    <Router>
      <Switch>
        <Route exact path={"/"} component={Home} />
        <Route exact path={"/category"} component={Category} />
      </Switch>
    </Router>
  );
}