我的 React bootstrap 路由页面路径在实时刷新后不起作用

Question

在这个 URL 你可以看到这个问题：http://qconstruct.in/contact

这是来自代码沙箱的代码 link：https://codesandbox.io/s/upbeat-hypatia-3pre9 看起来输出在代码沙箱中运行良好。但是我的托管网站在刷新其他路由页面后无法正常工作

我使用 React Router Bootstrap

import { BrowserRouter as Router, Route, Switch  } from "react-router-dom";
import { LinkContainer } from 'react-router-bootstrap';
import { Navbar, Nav, NavItem } from 'react-bootstrap';

Answer 1

尝试在构建的根目录中添加 .htaccess 文件

<IfModule mod_rewrite.c>

  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]

</IfModule>

Answer 2

此问题出在服务器端。

参考这个link： https://tylermcginnis.com/react-router-cannot-get-url-refresh/

我的主机中有 appache 服务器，所以我在根目录下的“.htaccess”文件中添加了以下代码我网站的路径。

RewriteBase /
RewriteRule ^index\.html$ - [L]
 RewriteCond %{REQUEST_FILENAME} !-f
 RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

有效！感谢大家的帮助。

我的 React bootstrap 路由页面路径在实时刷新后不起作用

My React bootstrap routed page path doesn't work after refreshing in live

router

reactjs

react-bootstrap

react-router-dom