将 Getter 传递给 Vuex 操作 returns null

Question

我正在尝试将 getter 传递给我的异步操作，它的控制台日志很好，但是调用 apollo 突变的 await 一直将其视为空值，而它只是打印了一个真实值到控制台... 我还使用 vuex-persisted-state 来保持商店数据的有效性。因此，在执行操作时 cartId 状态不为空...因此控制台正确记录 cartId 值的原因。

状态：

  cartId: null, //initially null, is set with mounted in another component

getters:

  getCartId(state) {
    return state.cartId
  },

操作：

  async getCartItems({ commit, getters }) {
    let getCartId = getters.getCartId
    console.log(getCartId) // returns: Z2lkOi8vc2hvcGlmeS9DYXJ0LzBhMDIxNDQ2ODQ0ZDU1MGRhZmZmMWJjZTIzNTBhNDY4
    const { data } = await this.app.apolloProvider.defaultClient.query({
      query: getCart,
      variables() {
        return {
          cartId: getCartId
        }
      },
      skip() {
        return !getCartId
      }
    })
  },

控制台错误： Uncaught (in promise) Error: GraphQL error: Variable $cartId of type ID! was provided invalid value

GraphQL 响应：Expected value to not be null

编辑： 问题似乎在于变量如何传递给我的查询

Answer 1

已通过使 variables 不是我等待中的函数来修复...

async getCartItems({ commit, getters }) {
    const getCartId = await getters.getCartId
    const { data } = await this.app.apolloProvider.defaultClient.query({
      query: getCart,
      variables: {
        cartId: getCartId
      },
      skip() {
        return !getCartId
      }
    })
    if (data.cart) {
      commit('updateCartObj', data.cart)
    } else {
      console.log('getCartItems Error' + data)
    }
  },

将 Getter 传递给 Vuex 操作 returns null

Passing Getter to Vuex Action returns null

async-await

vue.js

graphql

vuex

apollo-client