Vue 3是一款非常流行的JavaScript框架，它被廣泛應用于前端Web開發中。獲取DOM元素是前端開發中的常見任務之一，本文將向你介紹在Vue3中如何獲取DOM元素。

如你所知，Vue3使用了Composition API，它提供了一個特殊的函數refs來幫助我們獲取DOM元素。這個函數提供了一個對象，允許我們在模板中使用v-bind來綁定到這些引用，就像這樣：

<template>
<div>
<input type="text" v-model="message" :ref="textInput"/>
<button @click="focusTextInput">Focus the Text Input</button>
</div>
</template>
<script>
import { ref } from 'vue';
export default {
setup() {
const message = ref('Hello!');
const textInput = ref(null);
function focusTextInput() {
textInput.value.focus();
}
return {
message,
textInput,
focusTextInput
};
}
};
</script>

可以看到，在代碼中我們使用了ref()函數來定義一個textInput引用。然后，在模板中，我們使用v-bind綁定到它，就像這樣：:ref="textInput"。

接下來，我們定義了一個focusTextInput()函數，該函數會在按鈕被點擊時執行。該函數使用textInput.value.focus()語句來獲取DOM元素并將其聚焦。

這就是如何在Vue3中獲取DOM元素。使用refs函數，我們可以輕松地獲取并操作DOM元素。希望能夠對你的Vue3開發有所幫助！