URL-адрес приложения Connected Response обновляет, но не компоненты

Question

Я дважды проверил все учебники и часто задаваемые вопросы, но не могу понять, в чем заключается моя проблема.

Полный пример здесь: https://stackblitz.com/edit/react-hmuwhx?embed=1&file=App.js

Какой-то интересующий вас кодниже.Помощь оценена!

export const createRootReducer = history =>
  combineReducers({
    router: connectRouter(history),
    ui: uiReducer,
    user: userReducer
  });

const middlewares = [ReduxThunk];

export const history = createBrowserHistory();

export const store = createStore(
  createRootReducer(history),
  compose(applyMiddleware(...middlewares, routerMiddleware(history)))
);

<Provider store={store}>
  <App history={history} />
</Provider>

export class App extends React.Component {
  render() {
      return (
      <ConnectedRouter history={this.props.history}>
          <div className="full-height">
          <InitializingContainer>
              History length: {this.props.history.length}
              <Switch>
              <Route exact={true} path="/" component={HomePage} />
              <Route path="/test" render={() => <div>Test</div>}/>
              </Switch>
          </InitializingContainer>
          </div>
      </ConnectedRouter>
      );
  }
}

export class HomePage extends React.Component {
  render() {
    return (
      <ul>
        <li>You are here: {this.props.match.path}</li>
        <li>
          <Link to="/">Home</Link>
        </li>
        <li>
          <Link to="/test">Test</Link>
        </li>
      </ul>
    );
  }
}

Answer 1

Проблема в том, что ваш InitializingContainer не получает реквизиты маршрутизатора и, следовательно, не прослушивает изменения контекста истории маршрутов.

Использование withRouter с connect подобно

export const InitializingContainer = connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(Initializing));

решает проблему.