Почему я не могу назначить свойство объекту, используя скобки + переменную?

Question

Я очень новичок в Vuex и пытаюсь присвоить значение состоянию Vuex, (state.map.status.isReady для этого).

Однако я хочу сделать свой код многоразовым, поэтому я создалфункция changeMapStatus(state, key, value) для достижения этого.

Эта функция изменяет полученное свойство state.map.status.key до value.

Однако, когда я вызываю мутацию с this.$store.commit('changeMapStatus', 'isReady', true) изфайл компонента, он просто удаляет state.map.status.isReady, и это свойство становится undefined.

С другой стороны, если я изменяю функцию на

changeMapStatus(state, value) {
  state.map.status.isReady = value;
}

, это как-то работает.

Можете ли вы помочь мне, в какой момент я ошибаюсь?

Большое спасибо!

---

store.js (Vuex)

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    map: {
      status: {
        isReady: false,
      },
    },
  },
  mutations: {
    changeMapStatus(state, key, value) {
      state.map.status[key] = value;
    }
  },
});

Answer 1

Согласно Vuex официальным документам , мутация принимает 2 параметра состояния и полезную нагрузку.Вы можете использовать оператор распространения для получения значений из полезной нагрузки.

changeMapStatus(state, {key, value}) {
  state.map.status[key] = value;
}

this.$store.commit('changeMapStatus', {key: 'isReady', value: true})

Или же вы можете использовать его следующим образом

changeMapStatus(state, payload) {
  state.map.status = {
      ...state.map.status,
      ...payload,
  }
}

this.$store.commit('changeMapStatus', { isReady: true });

Answer 2

Вы можете передать объект в качестве параметра, который содержит key и value следующим образом:

changeMapStatus(state, myObj) {
  state.map.status[myObj.key] = myObj.value;
}

и вызвать его как:

this.$store.commit('changeMapStatus', {key:'isReady', value:true})