在Vue應用中，我們經常需要獲取用戶的輸入或點擊事件等，以便進行后續的計算或處理。Vue提供了豐富的方法來獲取元素的值、樣式、屬性等，并且可以直接綁定到數據對象中，實現數據與視圖的同步更新。下面我們來介紹Vue點擊獲取值的方法。

HTML：
<div id="app">
<button v-on:click="showValue">Click me</button>
</div>
JS：
new Vue({
el: '#app',
data: {
value: ''
},
methods: {
showValue: function() {
this.value = 'Hello, Vue!'
console.log(this.value)
}
}
})

在上述示例中，我們定義了一個按鈕，通過v-on指令綁定了點擊事件showValue，當用戶點擊按鈕時，將通過showValue方法獲取value的值，并打印到控制臺中。在Vue中，可以通過this關鍵字來訪問當前實例中的數據對象及方法。

除了通過方法來獲取值，Vue還提供了指令v-model來實現雙向綁定，即通過數據對象來更新視圖，同時也可以通過視圖來更新數據對象。v-model指令可以應用于大多數表單元素，包括input、textarea、select等。

HTML：
<div id="app">
<p>{{ message }}</p>
<input v-model="message">
</div>
JS：
new Vue({
el: '#app',
data: {
message: ''
}
})

在上述示例中，我們定義了一個輸入框，通過v-model指令綁定了message屬性，當用戶輸入時，message的值將會實時更新。同時，我們在頁面中也顯示了message的值，以便用戶更直觀地了解當前狀態。

除了v-model指令，Vue還提供了一些其他的指令來獲取元素的屬性、樣式等。比如，可以使用v-bind指令來綁定元素的class、style等屬性：

HTML：
<div id="app">
<p v-bind:class="{ red: isRed }">{{ message }}</p>
<button v-on:click="toggleRed">Toggle Red</button>
</div>
JS：
new Vue({
el: '#app',
data: {
message: 'Hello, Vue!',
isRed: false
},
methods: {
toggleRed: function() {
this.isRed = !this.isRed
}
}
})

在上述示例中，我們定義了一個p標簽，并通過v-bind指令綁定了class屬性，當isRed為true時，將會添加red類名。而isRed的值則通過toggleRed方法來更新，當用戶點擊按鈕時，將會切換isRed的值。

通過Vue提供的豐富指令及方法，我們可以輕松獲取元素的值、樣式、屬性等，而這些值可以直接應用于數據對象中，實現數據與視圖的同步更新。因此，Vue在編寫交互性較高的應用時，具有很大的優勢。