React-Router v4 - 浏览器路由器动态路由

【问题标题】：React-Router v4 - Browser Router Dynamic RoutingReact-Router v4 - 浏览器路由器动态路由
【发布时间】：2017-12-27 21:01:53
【问题描述】：

我正在尝试使用 React Router v4 实现浏览器路由器。我的项目 url 将是“http://localhost:8080/Project/reactjs/Main.html/SearchProduct”，下面是我设置路由路径的方式。但是我得到路由未找到异常。任何帮助将不胜感激

const routers = (<BrowserRouter basename="/Project/reactjs/Main.html">
    <div>
      <ProductScreen/>
    </div>
  </BrowserRouter>);

render(routers, document.querySelector('.mainContainer'));

In Product Screen :
const ProductScreen = () => {
  return (
    <Switch>
      <Route
        exact
        path="/add"
        component={AddProduct}
      />
      <Route
        exact
        path="/SearchProduct"
        component={SearchProduct}
      />
    </Switch>
  );
};

【问题讨论】：

你找到方法了吗。如果是这样，请让我们知道你是怎么做的。提前致谢

标签： react-router

【解决方案1】：

我认为您的代码大部分是正确的，但请尝试从 Routes 中删除 exact。正如documentation for <Route exact ... /> 所说：

当true时，只有当路径与location.pathname匹配时才会匹配完全匹配。

这表示整个路径，而不是BrowserRouter 的相对路径。我在没有exact 的情况下使用basename 取得了成功，尽管我没有测试你的代码。

【讨论】：