Блог

У меня есть мутация Vuex с пространством имен, и я пытаюсь обновить несколько свойств состояния одновременно. Чтобы избежать повторения, я хотел бы использовать оператор распространения ES6. Object.assign работает должным образом, но оператору распространения не удается обновить состояние VUEX. Вот код, который иллюстрирует проблему:

 const authorizationModule = {
  namespaced: true,
  state: {
    status: '',
    jwt: '',
    user: {
      email: ''
    }
  },
  mutations: {
    AUTH_SUCCESS(state, payload) {
      const { jwt, user } = payload;

      // Too much repitition (needs to be abstracted)
      state.jwt = jwt;
      state.status = 'status';
      state.user = user;

      // 1. Object.assign works correctly
      // state = Object.assign(state, {
      //   jwt,
      //   status: 'success',
      //   user
      // });

      // 2. Spread operator does not work
      // let newState = {
      //   ...state,
      //   jwt,
      //   status: 'success',
      //   user
      // }
      // state = newState
    },
  }
}
  

Это интересно, потому что я запустил отладчик в код и проверил его в браузере. Похоже, что возвращаемое значение для оператора распространения возвращает другой объект. Реализация Object.assign, похоже, имеет функции getter и setter в объекте (именно по этой причине он работает так, как задумано). Вот изображение моей консоли:

Вы можете видеть, что у объекта во 2-м примере отсутствуют определенные методы получения и настройки Vuex.

Итак, остается вопрос: возможно ли использовать оператор распространения в этом контексте для обновления нескольких свойств состояния в Vuex?