Н
Там есть артикль про жизненный цикл компонентов
Size: a a a
2019 June 23
NO
Нашел. Не знал :) спасибо
Н
Всегда пожалуйста!
DM
Всем привет, подскажите, на сколько чревато использование async/await в ComponentDidMount в React.js ?
Основная цель: Дождаться загрузки всех данных перед рендером. (цепочка асинхронных действий)
async componentDidMount() {
const data1 = await this.props.fetchData();
const data2 = await this.props.fetchData1(data1);
const data3 = await this.props.fetchData2(data2);
console.log(data3);
}Основная цель: Дождаться загрузки всех данных перед рендером. (цепочка асинхронных действий)
Так обычный же паттерн - перед запросами ставишь state: loading, после - убираешь. В рендере смотришь на него и не показываешь ничего
NO
Ну чёт почитал объяснения, с ридаксом это не очень актуально
DM
Ну чёт почитал объяснения, с ридаксом это не очень актуально
Покажи, вроде везде запросы в маунте
NO
https://github.com/reactjs/reactjs.org/issues/302
Пишут, что связано со стейтом, и создавать стейт с двнными в конструкторе при асинхронном запросе может не сработать
Пишут, что связано со стейтом, и создавать стейт с двнными в конструкторе при асинхронном запросе может не сработать
NO
Когда ты Стейт не используешь для хранения данных - становится не актуально
LF
Да запросы всегда в маунте, просто когда необходимо дожидаться данных перед тем как сделать другой, componenDidMount уже не актуален, ибо срабатывает один раз.
DM
Да запросы всегда в маунте, просто когда необходимо дожидаться данных перед тем как сделать другой, componenDidMount уже не актуален, ибо срабатывает один раз.
Данные для запроса меняются?
LF
Данные для запроса меняются?
да, один зависит от другого
DM
да, один зависит от другого
То есть ты делаешь новый запрос при изменении какого-то значения в сторе?
LF
То есть ты делаешь новый запрос при изменении какого-то значения в сторе?
Код образно такой:
async componentDidMount() {
const data1 = await this.props.fetchData();
const data2 = await this.props.fetchData1(data1);
const data3 = await this.props.fetchData2(data2);
console.log(data3);
}DM
Почему срабатывание лишь один раз не работает для тебя?
DM
Кажется понял, у тебя компонент слишком умный становится
LF
Потому что в didMount у меня запускаются эти три экшина а дальше фиг пойми кто первый завершит, так как они асинхронные. If ы тут не помогут
DM
Потому что в didMount у меня запускаются эти три экшина а дальше фиг пойми кто первый завершит, так как они асинхронные. If ы тут не помогут
Так await задаёт порядок
LF
Так await задаёт порядок
код выше должен решить мою проблему, не пробовал. Вопрос был такой: насколько правильно так делать ? )
никогда не видел async ComponentDidMount
никогда не видел async ComponentDidMount
ММ
Код образно такой:
async componentDidMount() {
const data1 = await this.props.fetchData();
const data2 = await this.props.fetchData1(data1);
const data3 = await this.props.fetchData2(data2);
console.log(data3);
}Вот тут код как срабатывает?
Отправляется первый запрос, получает ответ. Обрабатывается. И потом же второй? Либо сразу после отправления 1го запроса, идет 2ой запрос?
Отправляется первый запрос, получает ответ. Обрабатывается. И потом же второй? Либо сразу после отправления 1го запроса, идет 2ой запрос?
DM
код выше должен решить мою проблему, не пробовал. Вопрос был такой: насколько правильно так делать ? )
никогда не видел async ComponentDidMount
никогда не видел async ComponentDidMount
Должен решить, асинхронные запросы в маунте - норма