👩💻 Callback Flush Timing
Во vue.js, есть вотчеры Watch и WatchEffect, которые отвечают за отсеивания изменения реактивной переменной и вызова колбека, который будет происходить.
Однако, vue.js предоставляет возможность регулировать, когда мы вызываем этот колбэк.
1 По умолчанию ('pre'):
Колбэки в watch и watchEffect вызываются до того, как DOM будет обновлен. Это означает, что если вы изменяете реактивные данные внутри колбэка, DOM еще не отразит эти изменения.
Это поведение полезно, если вам нужно выполнить какие-то действия до обновления DOM, например, для подготовки данных или валидации.
2 **post**:
Если вы хотите, чтобы колбэк вызывался после обновления DOM, вы можете указать опцию flush: 'post'.
Это полезно, если ваш колбэк зависит от обновленного состояния DOM, например, для работы с элементами DOM после их рендеринга.
3 'sync':
В редких случаях можно указать flush: 'sync', чтобы колбэк вызывался синхронно сразу после изменения реактивных данных.
Это может быть полезно для немедленного выполнения логики, но следует использовать с осторожностью, так как это может привести к проблемам с производительностью и сложностям в отладке.
`watch(source, callback, { flush: 'post' })
watchEffect(callback, { flush: 'post' })`
