javascript - Vuex 状态不会被通用函数改变，而专用函数会改变它

Question

我有一个 LokiJS 提供的存储，我用它在 autoloadCallback 中使用突变来更新 Vuex 状态。

LokIJS 存储:

var db = new loki('mydatabase', {
  autoupdate: true,
  autoload: true,
  autoloadCallback: setupHandler
})

Vuex 状态和突变:

const state = {
  ads: []
}

const mutations = {
  updateArray(from, to) {
      from = to
  },
  updateAds() {
      state.ads = db.getCollection('ads').data
  }
}

回调本身:

function setupHandler() {
  setupCollection('ads') // Just sets up the collection if it doesn't exist
  db.getCollection('ads').insert({dummy: "Dummmy!"})

  mutations.updateArray(state.ads, db.getCollection('ads').data)
  mutations.updateAds()    
}

这里的问题是调用 updateArray(state.ads, content) 不会将 state.ads 更改为 content，但是 updateAds() 函数本质上做同样的事情，只是不接受参数并将它们硬编码，相应地改变了 state.ads .

我为 updateArray 编写通用函数的方法的潜在问题是什么？有办法吗？

---

这是一个 JSFiddle MCVE example这种行为。

Answer 1

在不了解 loki 的细节的情况下，我认为您需要进行以下更改。

你的突变应该是这样的:

const mutations = {
  updateArray(state, to) {
      state.ads = to
    }
}

您的 setupHandler 函数应该如下所示:

function setupHandler() {
  setupCollection('ads')
  db.getCollection('ads').insert({dummy: "Dummmy!"})

  store.commit('updateArray', db.getCollection('ads').data)
}

突变是接受状态作为第一个参数的函数，以及包含参数的对象参数作为第二个参数。应使用商店的 commit 方法提交更改。

这是您的 fiddle updated .