Vuex Store 使用 'this' 访问状态

Question

我目前正在学习 Vuex 并正在阅读 this 部分官方 Vue 文档。我想知道是否有特殊原因我们会使用参数访问 state 而不是仅使用 this？我测试了它是否可以与 this 一起工作。

Vue 示例

const store = new Vuex.Store({
  state: {
    count: 1
  },
  mutations: {
    increment (state) {
      state.count++
    }
  }
})

我的例子

const store = new Vuex.Store({
  state: {
    count: 1
  },
  mutations: {
    increment () {
      this.count++;
    }
  }
})

Answer 1

Vuex store 实例不是一个拥有自己 this 的普通对象，它可以被看作是提供一些 input/output 的黑盒子，因为它将状态作为参数传递，然后在里面它的逻辑（模式）根据您的突变更新状态，this 可在此处获取：

 mutations: {
    increment () {
      this.count++;
    }
  }

它指的是全局window对象。

根据@Spinx 的评论，this 指的是版本 3 及更高版本中的 vuex 实例，我发现 @Matt 所说的是一个很好的说明：

IMO this is a great example of why you should use the explicit parameter since you don't know how your function is bound __Matt

Vuex Store accessing state with 'this'