vue的todolist

长话短说，第一步搭建基础页面框架

本次环境在vue-cli中，环境自行在vue官方文档中搭建，
所需要的vue基础也可参考vue官方文档
首先，我们很清楚这个页面长啥样，一个输入框，一个按钮，两个

包含一定的内容。
输入框
存在点击事件和v-model双向绑定。
按钮
将输入框数据获取并添加到
中


储存数据,并用v-model绑定一种状态，区分正在进行和已完成

第二步，实现功能

对于输入框：
+
将输入框中数据返到了todo里面，并切储存在数组中
在

中访问并显示

• 
  {{item.todo}}---删除

注：这一段中v-for访问并显示，v-model="item.checked"使得每条数据有两种状态可以区分，
还有一个删除功能，较好实现不再解释。

第三步这里的js部分，目的让数据增删，

学过js看懂不难，项目整体偏易。
export default{
data(){
return{
todo:'',
list:[{todo:'vue',checked:false}],
} },
methods:{
add(){
this.list.push({todo:this.todo,checked:false});
this.todo='';
},
deleteIt(key){
this.list.splice(key,1);
} } }