kkw在学习vue,一个简单的todoList

一直都不会写这个todolist的样子,趁着有点时间吧,然后今天写了一个超级简单的todolist。没有写啥css。
效果图如下
kkw在学习vue,一个简单的todoList_第1张图片

1、根据计算属性来获取数据的长度
image.png

2、根据计算属性来判断目前已经选择了几个(一个是用reduce去实现累加的效果,一个是forEach方法)
kkw在学习vue,一个简单的todoList_第2张图片

3、判断是否全选(全选或者全不选之后,需要更新数据的,所有用到了计算属性的set)
kkw在学习vue,一个简单的todoList_第3张图片

4、处理全选或者全不选
kkw在学习vue,一个简单的todoList_第4张图片

5、删除所选的数据(采用了数组过滤方式完成,也有一种方式,将选择数据的数据存进一个新的数组,之后遍历数组,然后将所选择的数据删除掉,forEach循环去做,只是觉得有点麻烦了)
kkw在学习vue,一个简单的todoList_第5张图片

6、经过上面的,基本上把todolist做完了,具体代码,已经上传git
https://gitee.com/hkkw/todoList

你可能感兴趣的:(vue.js,javascript)