【问题标题】:why react Router is not working . when i change the path?为什么反应路由器不工作。当我改变路径?
【发布时间】:2020-11-24 16:17:14
【问题描述】:

react 路由路径不起作用
它在所有 URL 中仅显示产品组件

我已经灌输了 react-router-dom,并且还导入 BrowserRouter 作为路由器, 转变, 路线, 链接

有什么问题?我想不通。

import React from 'react';
import Navbar from './component/Navbar/Navbar';
import Product from './component/Product/Product';
import {BrowserRouter as Router,Switch,Route,Link} from "react-router-dom";
import UpComing from './component/UpComing/UpComing';
import NotFound from './component/NotFound/NotFound';
import OrderReview from './component/OrderReview/OrderReview';

function App() {
  return (
    <div className="App">
      <Navbar></Navbar>
      <Router>
        <Switch>
          <Route to="/product">
            <Product></Product>
          </Route>
          <Route to="/OrderReview">
            <OrderReview></OrderReview>
          </Route>
          <Route exact to="/">
            <Product></Product>
          </Route>
          <Route to="*">
            <NotFound></NotFound>
          </Route>
        </Switch>
      </Router>
    </div>
  );
}

export default App;

【问题讨论】:

  • “它不工作”是什么意思?这里有几件事要更改:首先,如果组件没有任何子组件,则不应使用 渲染它们.您可以将它们替换为
  • 您应该使用Routepath 属性,而不是to

标签: reactjs router react-router-dom react-dom


【解决方案1】:

您应该在路线上使用path 而不是toto 用于Link 组件。我已经创建了您在代码框上工作的代码的最小表示

https://codesandbox.io/embed/react-router-playground-g0uzc?fontsize=14&hidenavigation=1&theme=dark

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2022-11-02
    • 2022-11-01
    • 1970-01-01
    • 2018-04-05
    • 2022-01-17
    • 1970-01-01
    相关资源
    最近更新 更多