Question

我正在使用带有React，Redux和React-router-dom的经典配置。开发中一切正常。和生产模式（本地主机和生产服务器）。我只是NoMatch程序有问题。

/ good-path，行得通
/错误路径有效，并显示NoMatch组件
/错误/路径，它显示白页（网络控制台中的404状态，网址错误www.myWebsite.com/wrong/path）

我正在使用： -反应16.8.4 -React-dom 16.8.4 -react-redux 6.0.1 -react-router-dom 5.0.1 -redux 4.0.1

这是我的配置示例：

<Provider store={store}>
  <Router>
    <div>

      <NavLink exact to="/">Home</NavLink>

      <NavLink exact to="/contact">Contact</NavLink>

      <Switch>
        <Route path="/" exact component={Home} />
        <Route path="/contact" component={Contact} />
        <Route component={NoMatch} />
      </Switch>

    </div>
  </Router>
</Provider>

一切正常，但我希望NoMatch组件将针对这种错误的路径显示：/ wrong / path（多个斜杠URL）。在这种情况下，index.html已加载，但我无法访问app.js之类的资源，使用此类URL www.myWebsite.com/wrong/app.js

，我遇到了网络错误404

感谢您的帮助。

Answer 1

一个朋友帮我完成这个任务。我在Webpack配置中找到了答案。

在输出设置中我需要更多详细信息，我有一个publicPath：“ /”：

if(!window.localStorage.getItem('page_size')){
    window.localStorage.setItem('page_size', 'big');
}

$(window).resize(function(){
    if(window.innerWidth < 767 || window.localStorage.getItem('page_size') == 'big'){
        window.localStorage.setItem('page_size', 'small');
        location.reload();
    }
    if(window.innerWidth > 767 || window.localStorage.getItem('page_size') == 'small'){
        window.localStorage.setItem('page_size', 'big');
        location.reload();
    }
});

感谢我的朋友乔治斯和这篇文章：https://stackoverflow.com/a/39278576/9945698

我对react-router-dom有问题，NoMatch不接受/ foo / bar之类的URL

1 个答案: