url 在 DEV 上使用 create-react-app 和 react-router-redux 刷新无法正常工作

Question

我正在尝试使用 react-router-redux 在我的 create-react-app 中实现最小路由。文档表明，如果不使用 create-react-app，则需要配置 Webpack 以使 url 刷新按预期工作（与 'history fall back' 相关的设置），但如果使用 create-react -app 这应该会自动工作。但是，在我的开发环境中，url 刷新没有按预期工作。详细信息：如果当我刷新页面时第二条路线的 url 在浏览器中是当前的，那么第二条路线会重新加载，而我本以为主路线（路径为“/”）会加载.我的 index.js 包括以下内容：

render(
    <Provider store={store}>
        <ConnectedRouter history={history}>
        <div>
            <Route exact path="/" component={MyHomeComponent} />
            <Route exact path="/roster" component={Roster} />
        </div>
        </ConnectedRouter>
    </Provider>,
    document.getElementById('root')

)

这可能是文档错误，还是我忘记了代码中的某些内容？非常感谢您的建议。

Answer 1

刷新应该保持相同的路径名，而不是重置为根目录。

我不确定您为什么要在刷新时转到根目录，但实现该目的的方法是在加载应用程序时手动导航。

import { createBrowserHistory } from 'history'

const history = createBrowserHistory()
history.replace('/')

ReactDOM.render((
  <Provider>
    <ConnectedRouter history={history}>
      ...
    </ConnectedRouter>
  </Provider>
), holder)

url 在 DEV 上使用 create-react-app 和 react-router-redux 刷新无法正常工作

url refresh nor working as expected with create-react-app and react-router-redux on DEV

react-router

react-router-redux

create-react-app