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=''//置空
}
}
})