Vue是一款先進的JavaScript框架，它提供了許多有用的功能，為前端開發注入了活力。其中，$(this)是一個重要的Vue指令，它的主要作用是獲取當前DOM元素。

$('button').on('click', function() {
$(this).addClass('active');
console.log($(this));
});

在這個示例中，我們通過jQuery選擇器獲取所有的 button 元素，并添加了一個點擊事件監控，當用戶點擊其中某個按鈕時，就會觸發事件回調函數。這個回調函數中使用了 $(this) 表示當前被點擊的按鈕元素，然后使用addClass方法為該元素添加了一個名為 active 的CSS類，并在控制臺輸出了該元素的詳細信息。

在Vue中，$(this)的使用方式略有不同。在Vue中，我們不再需要使用jQuery來獲取DOM元素，而是可以直接通過Vue實例的 $refs屬性來獲取對應的元素。$refs 屬性是一個對象，其中包含了按照名稱索引的所有DOM元素。例如：

export default {
mounted() {
this.$refs.myButton.addEventListener('click', this.handleClick);
},
methods: {
handleClick() {
console.log(this.$refs.myButton);
}
},
}

在這個示例中，我們通過 Vue實例的 mounted 生命周期鉤子函數來訪問 DOM 元素，獲取了名為 myButton 的 DOM 元素，并為它添加了一個點擊事件監控。當用戶點擊該按鈕時，就會觸發handleClick方法，并在控制臺輸出該DOM元素的詳細信息。