Vue.js是一個流行的JavaScript框架，它的核心原理之一是雙向綁定，這意味著當用戶修改數據時，界面將自動更新，反之也是如此。這使得Vue.js非常適合構建響應式用戶界面，并且使得它比其他傳統的前端框架更加簡潔和易于使用。

在Vue.js中，使用v-model指令可以輕松實現雙向綁定。v-model用于將表單元素的值和Vue實例中的數據進行綁定，代碼如下：

在這個例子中，我們使用v-model指令將輸入框的值綁定到Vue實例中名為message的數據屬性上。當用戶在輸入框中輸入數據時，message屬性的值會自動更新；反之，如果修改了message屬性的值，輸入框的值也會隨之更新。

Vue.js是如何實現雙向綁定的呢？答案是Vue.js通過使用Object.defineProperty方法來實現的。這個方法允許我們在對象上定義一個屬性，同時可以定義get和set函數，使得當該屬性被讀取或修改時，我們可以輕松地進行監視，從而實現雙向綁定。

在Vue.js中，每個組件實例都對應一個watcher對象。該對象負責對組件中使用的所有數據進行監視，并在數據變化時自動更新界面。當我們在模板中使用v-model指令時，Vue實例會自動為該指令創建一個watcher對象，并將其綁定到對應的表單元素上。

下面是一個完整的例子：

<!-- 組件模板 -->
<template>
<div>
<input v-model="message" />
<p>{{ message }}</p>
</div>
</template>
<!-- 組件定義 -->
<script>
export default {
data() {
return {
message: ''
}
}
}
</script>

在這個例子中，我們定義了一個組件，其中包含一個帶有v-model指令的輸入框和一個p標簽，用于顯示用戶輸入的值。當用戶在輸入框中輸入數據時，watcher對象將會自動監聽到數據的變化并進行更新，從而使得頁面上的p標簽也會自動更新。

總結一下，Vue.js之所以被稱為“響應式”框架，就是因為它借助watcher對象和Object.defineProperty方法實現了一套高效而優雅的雙向綁定系統。這個系統使得當用戶修改數據時，界面自動更新，從而使得Vue.js成為了一個非常適合構建現代Web應用的框架。