要用 Vue.js 將資料與輸入框做繫結,我們可在 vue 建立的同時設定用來繫結的屬性,然後在 HTML 的輸入框元素中使用 v-model 設定所要繫結的屬性,這樣設定後輸入框的資料就會被寫入指定的屬性中,而指定屬性其值的變化也會呈現在輸入框中。
像是下面這樣的程式:
Vue - Hello World
{{message}}
new Vue({
el: '#app',
data:{
message: "Hello World"
}
})
其運行結果如下,在輸入框中輸入什麼,下方就會顯示什麼。