我們經常需要在網站中收集用戶的信息，輸入框是最常見的一種方式。在Vue中，我們可以使用input標簽來創建輸入框，并通過v-model指令來獲取用戶輸入的值。v-model指令綁定的是一個變量，在用戶輸入時會自動更新這個變量的值。接下來我們將詳細講解如何使用v-model指令獲取input框的值。
v-model指令是Vue的一個核心指令，可以用于在表單中雙向綁定數據。在上面的例子中，我們使用v-model指令將message變量和input框綁定起來。當用戶在input框中輸入任何值時，message變量會自動更新為input框中的值。placeholder屬性是一個可選的屬性，用于在input框中顯示占位文本。
new Vue({
el: '#app',
data: {
message: ''
},
})在Vue中，我們使用data選項來定義數據。在上面的例子中，我們定義了一個message變量用于存儲input框的值。為了能夠使用這個變量，我們需要將Vue實例的data選項中添加這個變量?，F在，我們已經將message變量和input框綁定在一起了，用戶輸入內容時message變量也會隨之改變。
當用戶輸入內容后需要將數據保存到服務器或在頁面上展示出來。這時，我們可以創建一個按鈕，將用戶輸入的數據提交到服務器。在Vue中，我們使用@click指令來監聽按鈕的點擊事件，并綁定一個名稱為submit的方法。
new Vue({
el: '#app',
data: {
message: ''
},
methods: {
submit() {
alert(this.message)
}
}
})在上面的例子中，我們在Vue實例中添加了一個submit方法，用于在按鈕點擊時彈出一個包含message變量值的提示框。方法中的this.message就是我們之前定義的message變量，它存儲了用戶輸入的值。在實際項目中，我們可以將這個值發送到服務器進行保存或進一步處理?，F在，我們已經成功獲取了input框中的值，并可以使用這個值進行后續操作了。