欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

对vuex中的{commit} 解构赋值的理解

程序员文章站 2022-04-02 23:02:10
...
actions: {
    loadData(context, { page }) {
      console.log(context)
      const { commit } = context 
      axios
        .get('http://localhost:3009/api/v1/products', {
          params: {
            page
          }
        })
        .then(res => {
          console.log(res.data)
          commit('loadDataEnd', res.data)
        })
    }
  }

代码第3行打印context,得到的结构是,context里面有一个commit属性,这个属性是个函数,所以commit里面是要提交的参数。

commit 操作会传递两个参数 type payload

  • type表示mutation中的名字
  • payload(载荷)表示参数
    对vuex中的{commit} 解构赋值的理解
    但一般代码是这样写的,直接把{ commit }写在函数里面。
actions: {
    loadData({ commit }, { page }) {
      axios
        .get('http://localhost:3009/api/v1/products', {
          params: {
            page
          }
        })
        .then(res => {
          console.log(res.data)
          commit('loadDataEnd', res.data)
        })
    }
  }

推荐大家阅读:更易理解
https://www.cnblogs.com/wyq1995/p/12008138.html

相关标签: vue