javascript - Vuex 商店不更新状态

Question

我的应用程序有一个小功能，如果用户点击特定图像，它应该被列表删除并移动到 Vuex 商店中的另一个图像中。

这非常简单:

// Action
  async movePicture({ commit }, data) {
    try {
      const comment = await this.$axios.$post('/photo-check', data)
      commit('MOVE_PHOTO', photoId)
    } catch (error) {
      throw error.response
    }
  },

  // Mutation
  MOVE_PHOTO: (state, id) => {
    const i = _.findIndex(state.list, p => p.id === id)
    if (i > -1) {
      const photo = state.list[i]
      state.list.splice(i, 1)
      state.visited.push(photo)
    }
  },

重点是，不幸的是这张图片不会从 list 拼接，我不明白为什么......也许我应该使用特定的东西来更新 Vuex 中的数组，但我不知道。 ..我也找不到与此不同的解决方案...

Answer 1

JavaScript 不擅长处理这些情况。

你应该使用

this.$delete(state.list, index)

Vue.delete为你带来魔力。