index.html
<div id="app">
<p>{{title}}</p>
<ul>
<li v-for='todo in todos'>{{todo}}</li>
</ul>
<div>
<!-- v-model指令用於在表單類元素上雙向綁定數據 -->
<input type="text" v-model='mytodo'>
<button @click="handleClick">添加</button>
</div>
</div>
main.js
new Vue({
//el:組件選擇器,哪個組件是vuejs的實例
el: '#app',
data:{
mytodo:'',
},
methods:{
handleClick(){
console.log(this.mytodo)
this.title='hello Program',
this.todos.push(this.mytodo)
this.mytodo=''//置空
}
}
})