Vue是一個流行的JavaScript框架，可以用于構建現代Web應用程序。它特別適用于處理大量的數據和操作復雜的用戶界面。在Vue中，獲取頁面輸入數據的過程非常簡單。通過使用v-model指令，Vue可以綁定表單輸入元素到數據對象，這使開發者能夠實時地獲取和更新用戶輸入的數據。

<template>
<div>
<form>
<div>
<label>用戶名:</label>
<input v-model="username" type="text">
</div>
<div>
<label>密碼:</label>
<input v-model="password" type="password">
</div>
<button @click="login">登陸</button>
</form>
</div>
</template>
<script>
export default {
data() {
return {
username: "",
password: ""
}
},
methods: {
login() {
console.log(this.username, this.password);
// 在此處處可以處理登陸邏輯
}
}
}
</script>

在上面的代碼示例中，我們使用v-model指令將用戶名和密碼輸入框綁定到組件的data對象。用戶在輸入框中輸入文本時，Vue會自動將其更新到組件的data對象中。在methods屬性中定義的login函數中，我們可以輕松地訪問data對象中的username和password屬性，并將它們用于處理用戶的登陸邏輯。