В чем разница между created и beforeCreate во Vue

«В чем разница между created и beforeCreate во Vue» — вопрос из категории Vue, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

created и beforeCreate — это хуки жизненного цикла Vue, но они вызываются на разных этапах инициализации компонента.

beforeCreate:

  • Вызывается сразу после инициализации компонента.
  • Данные (data), методы, вычисляемые свойства и события ещё не доступны.
  • Используется редко, например, для плагинов, которым нужно выполнить код до инициализации реактивности.

created:

  • Вызывается после инициализации реактивности.
  • Данные (data), методы и вычисляемые свойства доступны, но DOM ещё не сгенерирован.
  • Часто используется для API-запросов или начальной настройки данных.

Пример:

export default {
  data() {
    return { message: 'Hello' };
  },
  beforeCreate() {
    console.log(this.message); // undefined
  },
  created() {
    console.log(this.message); // 'Hello'
  }
};