pt
new Vue({
el: ‘#app’,
data: {
newItem: ”,
items: []
},
methods: {
addItem: function () {
if (this.newItem !== ”) {
this.items.push(this.newItem);
this.newItem = ”;
}
}
}
})
“`
然后我們可以在HTML中使用Vue的模板語法來定義組件，如下所示：
“`html
“`
在這個模板中，我們使用v-model指令將輸入框的值綁定到Vue實例的newItem屬性上，使用@click指令監聽添加按鈕的點擊事件，并調用addItem方法將新的待辦事項添加到列表中，最后使用v-for指令遍歷items數組，將每個待辦事項渲染為一個li元素。
這樣我們就完成了一個簡單的TodoList應用的開發，這個應用使用了Vue的響應式數據綁定、組件化開發模式和模板語法，使得代碼更加簡潔、易于維護和擴展。
