В чем заключается отличие между хуками created и mounted в Vue.js?

Sobes Copilot

Получайте ответы в реальном времени

Ответ от нейросети

sobes.tech AI

created вызывается после создания экземпляра Vue, но до монтирования в DOM. Данные реактивны, доступны методы и computed-свойства. Подходит для инициализации данных, выполнения AJAX-запросов.

mounted вызывается после монтирования экземпляра Vue в DOM. Доступен $el, представляющий корневой DOM-элемент. Подходит для работы с DOM, интеграции сторонних библиотек, которые требуют наличия DOM-элемента.

Хук	Время вызова	Доступен `$el`	Подходит для
`created`	После создания экземпляра, до монтирования	Нет	Инициализация данных, AJAX
`mounted`	После монтирования в DOM	Да	Работа с DOM, интеграция библиотек

// Пример использования created
created() {
  // Получение данных с API до монтирования
  this.fetchData();
},

// Пример использования mounted
mounted() {
  // Инициализация библиотеки, которая работает с DOM
  new Chart(this.$refs.myChartCanvas, ...);
}