مراجع القالب تسمح لك بالحصول على مرجع مباشر إلى عنصر DOM فعلي (أو نسخة من مكون فرعي) عندما تحتاج إلى فعل شيء حتمي لا يغطيه النموذج التعريفي في Vue — مثل تركيز input، أو قياس عنصر، أو استدعاء طريقة من طرق المكون الفرعي.
الوصول إلى عنصر DOM
vue
<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>
النمط: قم بتصريح ، أرفقه عبر على العنصر، وبعد التجميع، هو عقدة DOM الفعلية. إنه قبل التجميع، لذا قم بالوصول إليه في (أو لاحقاً)، وليس أثناء setup.