1 个动作 2 个提交（突变），但我必须等待我的第一个提交完成加载

Question

我的操作是这样的：

actions: {
    getFireBaseOrders(state) {
      db.collection(`ordersOptimized`)
        .where("date", ">=", 20210107)
        .onSnapshot((res) => {
          const changes = res.docChanges();
          changes.forEach((change) => {
            let payload = change.doc.data();
            state.commit("firebaseOrders", payload);
          });
        });
        state.commit("shopPerformanceTable")
    },

这家商店将我的 firebase 东西推送到我所在的州。

第一个突变是这样的：

firebaseOrders(state, payload) {
  for (let i = 0; i < Object.keys(payload).length - 1; i++) {
    state.firebaseOrders.unshift(payload[i]);
  }

第二次突变是这样的：

shopPerformanceTable(state){
  // console.log(state.firebaseOrders)
  state.shopPerformanceTable = Object.values(
    state.firebaseOrders.reduce((newArray, oldArray) => {
      const key = oldArray.shopname;

      newArray[key] = newArray[key] ?? {
        shopName: oldArray.shopname,
        orders: 0,
        revenue: 0,
        pendingOrders: 0,
      };

      newArray[key].orders++;
      newArray[key].revenue += oldArray.subtotal;

      if (oldArray.statuses == "pending") {
        newArray[key].pendingOrders++;
      }

      return newArray;
    }, {})
  );
  // console.log(state.shopPerformanceTable);
},

问题是，它们运行是同步的，这意味着在第二次突变时，state.firebaseOrders 仍然是一个空数组，并且将 return 和空数组。我如何等待我的突变 firebaseOrders 在运行 shopPerformanceTable 突变之前先完成？

Answer 1

我不使用 Firebase，但看起来你的第二次提交位置错误。试试这个：

getFireBaseOrders(state) {
  db.collection(`ordersOptimized`)
    .where("date", ">=", 20210107)
    .onSnapshot((res) => {
      const changes = res.docChanges();
      changes.forEach((change) => {
        let payload = change.doc.data();
        state.commit("firebaseOrders", payload);
      });
      state.commit("shopPerformanceTable");
    });
},

这是在 forEach 执行后将第二个提交移动到 onSnapshot 回调中。

1 个动作 2 个提交（突变），但我必须等待我的第一个提交完成加载

1 action 2 commits (mutations), but I have to wait for my first commit to finish loading

javascript

firebase

vue.js

vuex

google-cloud-firestore