Vuex 的项目实例9 清除已完成

点击清除已完成按钮，把列表中的已完成就会被清除，只剩下未完成的任务事项。

1、给“清除已完成”添加点击事件：

<!--把已经完成的任务清空-->
<a @click="clean">清除已完成</a>

<script>
export default {
  methods: {
    // 清除已完成的任务事项
    clean() {
      this.$store.commit('cleanDone')
    }
  }
}
</script>

2、在 store/index.js 中添加 cleanDone：

mutations: {
    // 清除已完成的任务
    cleanDone(state) {
      state.list = state.list.filter(item => item.done === false)
    }
  }

现在点击“清除已完成”按钮，可以清除掉已经完成的任务事项。