Vue.js Vuex映射状态集状态

在我的店里我有

...
  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'])
        }
      }

在我的组件中，我有

...
  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映射地址和地址。 用户从地址选择框中选择地址（例如地址[1]）。。。用于更新地址的

让我困惑的是，用这种方式更新this.address很有效。。。我的Vuex商店发生了变化。我想我必须发送/提交等。。？这似乎太简单了。。太容易了

在组件级别以这种方式更新this.address安全吗

在组件级别以这种方式更新this.address安全吗

不，至少您应该提交来自突变的更改（或调用提交突变的操作）。从：

在Vuex存储中实际更改状态的唯一方法是提交一个突变

此外，您修改地址的方式可能不会发生您可能认为：

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

无论如何，重新分配这样的计算属性是毫无意义的（可能不可能？不确定Vue是否冻结）。实际发生的是

对象。赋值总是直接变异第一个参数。这就是为什么您可能经常看到空对象模式，例如
object.assign（{}，this.address，this.address[newval]）

无论如何，为了避免像这样细微的意外突变，您可以启用它，当这些不安全的突变发生时，它会警告您。
谢谢-我认为它太简单了：）我已经将突变映射到我的组件方法，并添加了这个。UPDATE_ADDRESS（this.addresses[newval]）；