首页 > 其他 > 详细

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

时间:2020-05-11 18:32:09      阅读:78      评论:0      收藏:0      [点我收藏+]

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

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)
    }
  }

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

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

原文:https://www.cnblogs.com/joe235/p/12743339.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!