在 vuex 操作中访问 this.$fireStore (Nuxt.js)答案

【问题标题】：Access this.$fireStore in vuex action (Nuxt.js)在 vuex 操作中访问 this.$fireStore (Nuxt.js)
【发布时间】：2020-07-16 03:20:31
【问题描述】：

Here 声明 $fireStore 可以在 vuex action 中访问：

async randomVuexAction({ commit, state, rootState }, userId) {
  const ref = this.$fireStore.collection('users').doc(userId)
  ...
}

问题：在store/index.js中触发操作后：

addItem: ({ commit, getters }, itemName) => {
  const item = { name: itemName }
  this.$fireStore.collection('items').add(item).then((res) => {})
}

我收到错误：Cannot read property '$fireStore' of undefined。一般来说，console.log(this) 在除nuxtServerInit() 之外的所有操作中 - 给出undefined。那么甚至可以在vuex 中使用$fireStore 还是文档具有误导性？

【问题讨论】：

标签： firebase vue.js google-cloud-firestore nuxt.js vuefire

【解决方案1】：

尝试为您的操作删除箭头符号（因为“this”与箭头符号不指代同一事物）即

addItem ({ commit, getters }, itemName) {
  const item = { name: itemName }
  this.$fireStore.collection('items').add(item).then((res) => {})
}

注意：这同样适用于 Vue 组件中的计算属性和方法。遵循文档，不要为了它而改变任何东西。

【讨论】：