> Как получить доступ к DOM элементам через ref в created и mounted хуках во Vue (Vue.js)

В хуке created доступ к DOM-элементам через ref невозможен, так как на этом этапе компонент ещё не смонтирован, и виртуальное DOM-дерево не преобразовано в реальное. Все ref будут undefined.

В хуке mounted компонент уже смонтирован, и ref доступны. Пример:

<template>
  <div ref="myDiv">Привет, мир!</div>
</template>

<script>
export default {
  mounted() {
    // Доступ к DOM-элементу через ref
    const element = this.$refs.myDiv;
    console.log(element.textContent); // "Привет, мир!"
  }
}
</script>

Если нужно выполнить действия с DOM до монтирования, используйте $nextTick внутри mounted или другие хуки, такие как beforeMount (но там ref ещё не определены). Для работы с ref в Composition API (Vue 3) используйте ref из vue и назначайте его в setup(), но доступ к элементу также будет только после монтирования, например, через onMounted.