PF
Т Т
То есть не обязательно после завершения функции?
асинхронность ты не можешь предугадать в какой конкретно момент оно сработает, просто после какого то момента
Size: a a a
2021 January 20
AL
Представь что каждый setState это как ты добавляешь что-то в очередь
AL
И как только реакт может, то он выполняет все что в очереди
ТТ
Обязательно, ререндер не произойдет пока функция не отработает.
Имел ввиду что обязательно после функции, но не обязательно сразу после функции
AL
Т Т
Имел ввиду что обязательно после функции, но не обязательно сразу после функции
Да
AL
Именно, советую прочитать как react fiber и reconciler устроен
RS
Т Т
Доброго времени суток, помогите пожалуйста разобраться!
Понятно как и при каких случаях происходит повторный рендеринг и как дочерние компоненты реагируют на это... Вопрос в другом! Вопрос: К примеру есть Component, в котором объявлена функция(ниже), которая вызывается снаружи!
const doFetch = (options = {}) => {
setOptions(options)
setIsLoading(true)
}
Понятно что при вызове этой функции из-за изменения state произойдет повторный рендеринг компонента. Но не понятно когда произойдет повт-ый рен-инг? То есть после завершения функции или при выполнении функции, например - после этого setOptions(options) произойдет повторный рендеринг, а потом после setIsLoading(true), хотя наверное такое не будет, так как после пов-го рен-га функция сама не вызовется! Остаётся думать что - при выполнении функции будет запланировано два рендеринга и после завершения выполнения функции произойдет два пов-ных ренг-га поочередно. Так оно и есть или по-другому? Объясните пожалуйста этот момент
Понятно как и при каких случаях происходит повторный рендеринг и как дочерние компоненты реагируют на это... Вопрос в другом! Вопрос: К примеру есть Component, в котором объявлена функция(ниже), которая вызывается снаружи!
const doFetch = (options = {}) => {
setOptions(options)
setIsLoading(true)
}
Понятно что при вызове этой функции из-за изменения state произойдет повторный рендеринг компонента. Но не понятно когда произойдет повт-ый рен-инг? То есть после завершения функции или при выполнении функции, например - после этого setOptions(options) произойдет повторный рендеринг, а потом после setIsLoading(true), хотя наверное такое не будет, так как после пов-го рен-га функция сама не вызовется! Остаётся думать что - при выполнении функции будет запланировано два рендеринга и после завершения выполнения функции произойдет два пов-ных ренг-га поочередно. Так оно и есть или по-другому? Объясните пожалуйста этот момент
2 рендера родителя и дочерних? или каждого по одному? не совсем понятно из контекста
ТТ
2 рендера родителя и дочерних? или каждого по одному? не совсем понятно из контекста
Я про сам компонент где функция объявлена
RS
Т Т
Я про сам компонент где функция объявлена
не важно количество затронутых стейтов в рамках одного компонента, он их стакнет в 1 рендер
RS
Иначе бы все делали объект в useState чтобы сократить количество рендеров, что противоречит самой концепции стейта в FC
ТТ
Именно, советую прочитать как react fiber и reconciler устроен
Спасибо понял)
AL
не важно количество затронутых стейтов в рамках одного компонента, он их стакнет в 1 рендер
Нэт, если хуки тогда будет два ререндера
AL
По крайней мере так было год назад, типо это оч плохая практика несколько изменений подряд делать. Но повторюсь это относится только к хукам
ТТ
Именно, советую прочитать как react fiber и reconciler устроен
Спасибо, это понял! Еще один вопрос. Если setState происходит внутри useEffect то сразу происходить рендеринг или так же планируется асинхронно? и самое ключевое что хочу понят - если все таки сразу происходит рендеринг то после рендеринга код продолжает выполняться с оставшегося места?
ТТ
Именно, советую прочитать как react fiber и reconciler устроен
Благодарю за совет! Скорее всего так и сделаю!
PF
Т Т
Спасибо, это понял! Еще один вопрос. Если setState происходит внутри useEffect то сразу происходить рендеринг или так же планируется асинхронно? и самое ключевое что хочу понят - если все таки сразу происходит рендеринг то после рендеринга код продолжает выполняться с оставшегося места?
сначала отрендериться, потом хук сработает, так же сработает при каждом изменении, одной из зависимостей которые ты указал в массиве.
PF
setstate асинхронны для оптимизации производительности, там есть свой шедулер, ReactFiberScheduler, он собирает изменения в батчи, создает виртуальную ветку DOM, производит все изменения и применяет диффы к Dom, это сделано так, потому что каждый setState вызывает ререндер, поэтому они складываются в батчи, чтобы лишний раз не рендерить
PF
немного сумбурно, но надеюсь в общих чертах понятно
PF
Т Т
Спасибо, это понял! Еще один вопрос. Если setState происходит внутри useEffect то сразу происходить рендеринг или так же планируется асинхронно? и самое ключевое что хочу понят - если все таки сразу происходит рендеринг то после рендеринга код продолжает выполняться с оставшегося места?
пока компонента не демонтируется, стейты сохранятся
ТТ
сначала отрендериться, потом хук сработает, так же сработает при каждом изменении, одной из зависимостей которые ты указал в массиве.
получаться Error в зависимостях нет! Если рассуждать - то когда выполнение дойдет до setError(...) рендеринга не будет и выполнение перейдет к setIsLoading и тем самым эти два setState React соберет вместе их и в один прекрасный момет их подряд выполняет? Грубо говоря