Vuex mapState установить состояние - PullRequest
Новая
       12

Vuex mapState установить состояние

0 голосов
/ 25 мая 2018

В моем магазине у меня есть ... 

...
  addresses: [ /* array of address objects */ ],
  address: { /* holds chosen address */ }
...

В моем компоненте у меня есть ... 

    import {mapState, mapActions} from 'vuex'

      export default {
        name: 'AddressBook',
        watch: {
          selectedAddress: function(newval) {
            // Update the address
            // address and addresses is mapped from the vuex store.
            this.address = Object.assign( this.address, this.addresses[newval]);
          }
        },
        data: {
          selectedAddress: 0 /* Address selected by index */
        }
        computed: {
          ...mapState(['addresses', 'address'])
        }
      }

Адреса и адреса сопоставляются из vuex.Пользователь выбирает адрес из поля выбора адресов (например, address [1]) ... который используется для обновления адреса.

Меня смутило то, что обновление этого адреса просто так работает... Мой магазин Vuex меняется.Я думал, что я должен отправить / совершить и т.д ..?Это просто кажется слишком простым ... слишком простым ..

Безопасно ли обновлять этот адрес таким образом, на уровне компонентов?

1 Ответ

0 голосов
/ 25 мая 2018

Безопасно ли обновлять этот адрес таким образом, на уровне компонента?

Нет, по крайней мере, вы должны вносить изменения из мутации (или вызыватьдействие, которое совершает мутацию).Из документации по мутациям :

Единственный способ действительно изменить состояние в хранилище Vuex - это совершить мутацию.

Кроме того, способизменение адреса может происходить не так, как вы думаете: 

this.address = Object.assign( this.address, this.addresses[newval]);

Бессмысленно (возможно, невозможно? не уверен, если Vue зависнет) в любом случае переназначить вычисляемое свойство, как это.На самом деле Object.assign всегда изменяет первый параметр напрямую.Вот почему вы можете часто видеть шаблон пустого объекта, например Object.assign({}, this.address, this.addresses[newval])

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

...