接下来还剩下最后两个清除已完成和清除全部 todo 的功能，有了如何筛选todo 的经验，清除todo也是小菜一碟，只要把筛选出来的 todo 从 todos 列表删除就可以了。
老套路，先为按钮绑定事件，然后实现相应的绑定方法，相信你已经轻车熟路了：
<input type="button" value="清除已完成" @click="clearCompleted">
<input type="button" value="清除全部" @click="clearAll">
<script>
let id = 0; // 用于 id 生成
var app = new Vue({
...
methods: {
...
clearCompleted: function () {
this.todos = this.todos.filter(todo => !todo.completed)
},
clearAll: function () {
this.todos = []
}
},
})
</script>
bingo！恭喜你完成了一个非常酷的，具有极简风格设计的 todo 应用！！祝贺一下自己。
练习
用户体验增强。
现在我们的 todo 应用已经非常酷了。但是还有一点用户体验需要优化。虽然我们采用极简主义风格设计，但是我们在用户体验方面绝不马虎。这是我长期使用 Google、Amazon、Facebook 等国外一流企业的应用而获得的经验和感悟。
当没有todo是，全部标为完成的按钮和底部的删选栏一直出现，这是没有意义的，只有有 todo 时才让它们出现。试着完成这个功能。
当用户的全部 todo 都完成时想，显示的依然是剩余0项未完成，这给用户的感觉不好。为什么不显示一点别的信息，比如“全部完成，你真是太优秀了”。这能增大用户使用我么产品的粘性。试着完成这个功能。
同样的，之前已经提过，删除功能一定要柔软，不能太粗暴。现在用户如果不小心点了清楚全部的按钮，它的所有 todo 都没了，如果这些 todo 对它很重要的话。尝试实现清楚前确认提醒。之前我们已经实现过类似的需求。此外，给用户加一个回收站功能，用户能够查看已经删除的所有todo。
-- EOF --
作业：
这句是关键，主要是当leftTodosCount 不为0或者选项不是全部时都显示，以此避免在已完成这个筛选为0的情况下判断为全部完成。。
当切换到all时再更新leftTodosCount 如果是0，那么就表示全部完成了。