Какой этап рендера компонента отвечает в mounted

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

Ответ

mounted вызывается после первого рендера компонента в DOM. На этом этапе:

  • Компонент уже вставлен в DOM, можно безопасно обращаться к элементам через this.$el или refs.
  • Шаблон скомпилирован и отрендерен, но дочерние компоненты могут быть ещё не полностью смонтированы.
  • Подходит для DOM-зависимых операций: инициализация библиотек (например, карты, графики), подписки на события, запросы к API.
mounted() {
  // Пример: инициализация карты после рендера
  this.map = new Map(this.$refs.mapContainer, { ... });
}

⚠️ Не используйте mounted для изменения данных, которые влияют на шаблон — это вызовет лишний ререндер. Для этого лучше подходит created.