Question

对于我的CryptoCurrencypage我想为每个可用的货币创建一个Route。我有一个主要组件，它包含所有可能的路由，在那里我从redux获得了密码数据，映射在该数组上并为每种货币创建了一条路由。当我在主页（cryptodatalist）上并点击一个它工作得很好，但当我刷新网站或尝试直接导航到特定的详细信息页面时，它失败了。我怎样才能使它发挥作用？

 DetailRoutes = props.cryptos.map(val => {
    return (
      <Route
        key={val.id}
        exact
        path={"/" + val.name}
        crypto={val.symbol}
        render={props => <DetailsPage {...props} />}
      />
    );
  });

Answer 1

这不是react-router的问题。您实际面对的是注册路线存在的问题。因此，当您从主页导航到任何其他页面时，所有路由都在您项目的范围内。

但是当您直接导航到主页以外的其他URL时，将无法呈现，因为呈现这些路由的逻辑存在于主页中（即/或{{ 1}}路线）

有两种方法（我现在可以想到）-

如果有任何请求直接到达其他URL，您可以告诉服务器重定向到根路径。
对于您当前的开发黑客，您可以通过在root文件中包含publicPath: '/', historyApiFallback: true，将Webpack配置为在根路径后退。

（React Router v4）使用map创建路由

1 个答案: