Я боролся с навигацией в своем приложении после выполнения асинхронного вызова с использованием fetch. Эта функция вызывается onClick
const output = await fetch(`${process.env.REACT_APP_API_URL}/Endpoint`, {
method: 'POST',
headers: {
'Authorization': `Bearer ${this.props.login.login.bearerToken}`
},
body: JSON.stringify(this.state.thing1)
});
console.log(output);
toast.success("Lawyer added");
await this.props.history.push("/home");
С этим кодом URL обновляется до /home
, но экран не обновляется, чтобы содержать домашний компонент, который находится на этом маршруте. Если я уберу вызов, чтобы получить все работает как я ожидал. Поведение выглядит очень похоже на https://github.com/ReactTraining/react-router/issues/4924, но я не смог решить проблему с помощью withRouter
, и при этом я не использую чистые компоненты или компоненты, которые реализуют shouldComponentUpdate
. Как я могу обновить местоположение страницы после асинхронного использования fetch?
При этом используется подключенный-реагирующий-маршрутизатор, машинопись и избыточность. В моем примере я использовал объект истории, напрямую переданный из реквизита, но он также не работает, если я использую объект из магазина.
Обновление: я вижу, @@router/LOCATION_CHANGE
поражает мои редукторы.