todos实例
- 数据可以放在public中
- 使用axios调用public中的json数据
- 把axios中的数据在vuex中用Action调用（axios是异步处理，所以需要用Action）
- action通过调用mutations来操作date
添加事项
- 通过点击添加事项按钮，调用添加方法
- 在添加方法中，先判断输入文本是否为空，为空则提示。不为空则调用mutations修改list
- mutations中additem() 方法需要定义对应的属性，id、info、done。需要传入对应的值
删除事项
- 通过点击删除按钮，调用删除方法并传id，根据id进行删除事项
- 删除方法中，调用mutation中的removeItem 根据id 找到数组中对应的索引，然后根据索引删除对应项
修改事件状态
- 首先对复选框添加change事件，事件中再定义一个箭头函数，可以获取到e和id，再传给方法
- 在方法中获取到change事件传过来的e和id，可以通过e.target.checked 来获取到复选框的状态
- 方法中定义一个对象，来保存e.target.checked和id，通过this.$store.commit调用mutation方法，并传入对象
- 在store里，mutation定义方法，使用state.list.findIndex(x=>x.id===id)根据传入的id查找到对应的索引再使用state.list.done = param.statu修改复选框状态
统计未完成的任务数
- 首先在store中的getters内定义方法，使用过滤器来过滤状态为未完成的个数，state.list.filter(x => x.done === false).length
- 在组件中通过映射的方式，在计算属性中映射对应的方法，最后用插值表达式输出在 对应位置
清除已完成
- 给按钮添加点击事件，通过事件调用mutation
- 在mutation中使用过滤器，过滤到只剩下done为false的数，然后通过赋值给list达到刷新列表的功能
动态切换按钮的高亮效果
- 首先给按钮定义相同的方法，并设置不同的参数，通过调用mutation传入参数到state中，
- 在组件中通过映射的方式拿到state中的参数，再通过三元表达式判断对应的值并进行切换
切换按钮显示不同的值
- 使用getters，定义方法，通过过滤info的值来获取对应list
- 组件中通过映射，引入getters中的方法，使用插值引用