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为你做了一些神奇的事情。