Cобытия жизненного цикла компонента

3fe197e246c4bcfb38415c4daefe5890

Друзья, привет!

Практическое понимание событий жизненного цикла компонентов даёт возможность быстро анализировать и разрабатывать бизнес-задачи. Мы разберём 7 событий жизненного цикла компонентов на примере Composition API в Vue3 фреймворке.

onBeforeMount ()

Событие жизненного цикла срабатывает до появления компонента в DOM дереве.

  • Первым из всех событий жизненного цикла имеет доступ к реактивным данным.

  • Компонент создан. Первая фаза рендеринга не началась. Компонента ещё нет в DOM дереве.

Сигнатура метода

onBeforeMount(callback(): void): void

Выполнение функции callback синхронное. Можно выполнять асинхронный код в callback функции. Vue фреймворк не будет ждать завершение исполнения асинхронного кода.

Пример: получение данных с сервера

Мы можем запросить данные с сервера сразу после настройки реактивного состояния компонента в