Vue入门实战——备忘录
1.创建一个Vue实例
可通过 var app = new Vue({}） 创建一个Vue实例，el:'#content' 进行绑定。
2.data
在data:{} 中创建一个inputText:' ',用来接受用户的输入，list:[] 来接受用户已创建的未完成事务。
3.methods
在methods:{}中创建一个add()函数来添加用户输入的事项，del()函数来删除用户已添加的事项（表示已完成或添加错了）。
4.html部分
在html中创建一个input标签，添加属性v-model="inputText"用于数据的双向绑定，用户的输入可同时被inputText接受到，并可创建一个i标签添加v-on:click="add"来绑定点击添加事项函数。另外创建一个div标签来显示用户已添加的事务，通过添加属性v-for="(item,index) in list"，并在子元素中通过{{item.text}}即可显示用户已添加到list中的事务，同时可创建另一个子元素通过添加v-on:click="del(index)"绑定点击删除事项函数，并传入参数index来判断需要删除的是哪一项事务。
5.函数代码介绍
两个函数代码都极其简单。
- add:function():只需利用push()将inputText加入list中即可——this.list.push({text: this.inputText });
- del:function(e):只需删除list中index对应事务即可——this.$delete(this.list,e);
6.项目截图
利用上面的运作方式，简单地写下css样式，即可完成。（此备忘录只基本功能，其他功能完善看个人需要）
