Kako dajeTemplate Refs dostop do DOM elementov ali otroških komponent?

Predloge Refs vam omogočajo direktno referenco na pravi DOM element (ali primer otroške komponente), ko morate narediti nekaj imperativnega, česar deklarativni model Vue ne pokriva — kot je fokusiranje vnosa, merjenje elementa ali klicanje metode otroka.

Dostop do DOM elementa

<script setup>
import { ref, onMounted } from "vue";

const inputEl = ref(null);   // 1. create a ref (initially null)

onMounted(() => {
  inputEl.value.focus();      // 3. after mount, .value is the DOM element
});
</script>

<template>
  <input ref="inputEl" />     <!-- 2. ref attribute name matches the variable -->
</template>

Pristopu: deklariramo , ga pripnemo s na element, in po montaži je pravi DOM vozel. Pred montažo je , zato ga dostopamo v (ali pozneje), ne med setup.