Question

我正在尝试使用babel-standalone而不是适当的Babel编译来构建React应用（以使非Node用户更容易自定义而无需进行转换）。

这是我的设置（由于StackOverflow沙箱操作，您必须在本地运行此设置）：

<!DOCTYPE html>
<html>
  <head>
    <meta charset='UTF-8'>
    <script src='https://unpkg.com/react@16.3.1/umd/react.production.min.js'></script>
    <script src='https://unpkg.com/react-dom@16.3.1/umd/react-dom.production.min.js'></script>
    <script src='https://unpkg.com/react-router@3.2.0/umd/ReactRouter.js'></script>
    <script src='https://unpkg.com/babel-standalone@6.26.0/babel.js'></script>
  </head>
  <body>
    <div id='root'></div>
    <script type='text/babel'>
      const App = props => (
        <ReactRouter.Router history={ReactRouter.browserHistory}>
          <ReactRouter.Route path='/' component={A} />
          <ReactRouter.Route path='/b' component={B} />
        </ReactRouter.Router>
      )

      const Link = ReactRouter.Link
      const A = props => <h1><Link to='/b'>Link to B</Link></h1>
      const B = props => <h1>Welcome to B</h1>

      ReactDOM.render(<App />, document.querySelector('#root'));
    </script>
  </body>
</html>

这对于从组件A到B的链接很好。但是，如果我链接到B然后刷新页面，则会从静态服务器中获取404。有没有一种方法可以解决此问题，以便在用户请求B时加载路由host_address/b？任何建议都将大有帮助！

Answer 1

使用hashHistory的{{1}}参数使我很高兴，该参数将所有路由存储在history中，因此允许刷新：

/#/

React Router：使用babel-standalone

1 个答案: