在前端開發中，DOM操作是非常重要的一部分。而獲取DOM元素也是其中的一個關鍵環節。在Vue中，我們可以通過v-on指令來綁定點擊事件并獲取DOM元素。
首先，我們要在Vue的實例中定義一個data屬性，來存儲我們需要獲取的DOM元素。比如我們要獲取一個按鈕的DOM元素，可以這樣定義data：
new Vue({
data: {
buttonDom: null
}
})接下來，我們需要在頁面上渲染該按鈕，并且給它綁定一個點擊事件。在Vue中，我們可以使用v-on指令來實現：
上面的代碼中，我們給按鈕綁定了一個點擊事件，并且調用了一個名為handleClick的方法。接下來，我們需要在Vue實例中定義這個方法：
new Vue({
data: {
buttonDom: null
},
methods: {
handleClick() {
this.buttonDom = document.querySelector('button');
}
}
})在handleClick方法中，我們使用了原生的JavaScript代碼，通過querySelector來獲取了按鈕的DOM元素，并且將它存入了Vue實例的data中。
注意，在Vue中，我們推薦使用data屬性來存儲組件內部的狀態。因此，想要操作DOM元素并不意味著我們需要將它直接存入Vue的data中。我們可以在Vue實例的created鉤子函數中獲取DOM元素，并將其存儲到局部變量中。然后在組件的其他方法中使用該變量即可。
下面是一個完整的例子：
new Vue({
data: {
buttonDom: null
},
created() {
this.buttonDom = document.querySelector('button');
},
methods: {
handleClick() {
console.log(this.buttonDom);
}
},
template: ``
})在上面的例子中，我們在Vue實例的created鉤子函數中獲取了按鈕的DOM元素，并將其存儲到了buttonDom變量中。在handleClick方法中，我們直接使用了這個變量。這樣做可以讓我們更好地控制DOM元素，也更加符合Vue的數據驅動思想。
總之，通過v-on指令，我們可以很方便地為Vue組件綁定點擊事件，并獲取到相關的DOM元素。對于復雜的組件，在created鉤子函數中獲取DOM元素并存儲到局部變量中是一個不錯的做法。