javascript - 构建应用程序后 react 路由器不工作

Question

我是 React 和 React-router 的新手。该应用程序是使用 create-react-app 创建的.我需要在我的应用程序中使用两个主要页面实现路由。我尝试了很多选项，并最终使用以下代码使其工作。

此代码在开发期间运行良好。但是在构建应用程序后，它无法正常工作。仅显示到 404 页面的路由。请帮我解决这个问题。

<Router history={browserHistory}>
  <Route component={Root}>
    <IndexRoute component={App} />
    <Route path="/" component={App} />
    <Route path="/sna/:country" component={SNA} />
    <Route path="*" component={FourOFour}/>
  </Route>
</Router>

我已经使用 browserHistory 使用以下代码在更改下拉菜单时启用导航。

selectCountry(event){
    var value = event.target.value;
    browserHistory.push('/sna/' + value);
}

package.json

  {
  "name": "my-app",
  "version": "0.1.0",
  "homepage": "./",
  "private": true,
  "dependencies": {
    "bootstrap": "^3.3.7",
    "react": "^15.4.2",
    "react-addons-update": "^15.4.2",
    "react-bootstrap": "^0.30.8",
    "react-data-grid": "^2.0.24",
    "react-dom": "^15.4.2",
    "react-router": "^2.6.0"
  },
  "devDependencies": {
    "react-scripts": "0.9.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

Answer 1

这是一个潜在的服务器相关问题。您可能正在运行 Apache，并且它正在监听 :80。

对于 Apache 服务器:

确保您的 Apache 服务器将每个请求重定向到 index.html 文件。确保 .htaccess 中存在以下代码

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]