Отправка маршрутизатора на входе

Question

У меня есть проблема, я хочу отправить свое действие (isLoading) до того, как мой компонент отобразит маршрут, но когда я вызываю dispatch в событии onEnter, React выдает ошибку:

"Внимание: setState (...): Невозможно обновить во время существующего перехода состояния (например, в render или в конструкторе другого компонента). Методы рендеринга должны быть чистой функцией реквизита и состояния, побочные эффекты конструктора являются анти-шаблоном, но могут быть перемещеныв componentWillMount. "

Я понимаю, что эта ошибка является логическим результатом, потому что я изменяю свои данные в хранилище при рендеринге компонента, я не могу поместить диспетчеризацию в componentDidMount, потому что маршрутизирую дочерний рендеринг до того, как получу componentDidMountв родительском компоненте Route (пожалуйста, помогите мне), мне нужно хорошее решение для этого случая.

Мой код: `

const App = ({ location }) => {
  return (
        <div>
          {console.log(this)}
          <TransitionGroup className="transition-group">
            <CSSTransition
                key={location.key}
                timeout={0}
                classNames="fade"
            >
              <section className="route-section">
                <Switch location={location}>
                  <Route path="/" exact component={Index} onEnter= 
                       {store.dispatch(isLoading(true))}/>
                  <Route path="/news" exact component={News}/>
                  <Route path="/projects" exact component={Projects}/>
                  <Route path="/contacts" exact component={Contacts}/>
                  <Route path="/about"  exact component={About}/>
                </Switch>
              </section>
            </CSSTransition>
          </TransitionGroup>
        </div>
  )
};

`

Answer 1

Я думаю, что вам нужно заключить диспетчер в функцию, а не вызывать ее напрямую, например, так (предполагается, что вы работаете с синтаксисом ES6):

onEnter={() => store.dispatch(isLoading(true))}

Также обратите внимание, что в реакции-маршрутизаторе4 свойство onEnter больше не поддерживается, см. https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/guides/migrating.md#on-properties.