Uncaught Ошибка: Инвариант не удалось: вы не должны использовать снаружи <Router>

Question

Я пишу расширение chrome, используя React и Typescript. Я решил использовать MemoryRouter. И я получаю сообщение об ошибке типа Uncaught Error: Invariant failed: You should not use <withRouter(time_entry_edit_component_TimeEntryEditComponent) /> outside a <Router>. Вот мой код маршрутизации:

    import {MemoryRouter as Router, Route, Switch} from 'react-router-dom';
    import { TimeEntryEditComponent } from './components/time-entry-edit.component';
     <Router>
            <Switch>
              <StoreContext.Provider value={store}>
                <Route exact path="/" component={HomePageComponent} />
                <Route path="/time-entry/:id" component={TimeEntryEditComponent} />
                <Route path="/issue-edit/:id" component={IssueEditComponent} />
              </StoreContext.Provider>
            </Switch>
          </Router>

Вот как я подключаю свой TimeEnrtyEditComponent:

const wrappedComponent = withRouter<TimeEntryEditProps, any>(TimeEntryEditComponent);
export { wrappedComponent as TimeEntryEditComponent  };

Спасибо вперед!

Answer 1

Что ж, моя проблема заключалась в том, что в моей прежней функциональности было:

ReactDOM.unmountComponentAtNode(document.getElementById("mount"));
    ReactDOM.render(
      <TimeEntryEditComponent
        changeMode={this.changeMode.bind(this)}
        timeEntry={this.state.timeEntry}
      />,
      document.getElementById("mount")

Вот почему я заменил весь свой дом новым компонентом, что вызвало ошибку

Answer 2

Вам не нужен withRouter

В качестве прямого потомка маршрутизатора вы уже передали все методы маршрутизатора.

Просто пропустите withRouter и проверьте реквизиты компонента, который вы используете. должен видеть все, что вам нужно.