Question

如何将数据从vuex状态克隆到本地数据属性？

州

this.tsStore.shemes

数据属性

data () {
  return { shemes: [] }
}

我已尝试在更新的（）this.shemes = this.tsStore.shemes中执行此操作，但似乎还有约束力..因为当我删除this.shemes中的一项时，我也已删除了状态，并得到“请勿在变异处理程序之外变异vuex存储状态”的错误。

我需要克隆状态并执行我需要处理的数据，同时又不影响我的状态。

Answer 1

您需要创建一个新数组。 this.tsStore.shemes为您提供对绑定数组的引用。您可以尝试使用传播运算符或arr.slice（）创建具有相同内容的新数组。请注意，这是一个浅表副本。

this.shemes = [...this.tsStore.shemes]

或

this.shemes = this.tsStore.shemes.slice()

Answer 2

尝试

this.shemes = JSON.parse ( JSON.stringify ( this.tsStore.shemes) )

这将从商店中的数组中克隆所有值和对象。

Answer 3

data(){
  return {
    shemes: null,
  }
},
beforeMount() {
  this.shemes = this.stateShemes
},
computed: {
  stateShemes() { return this.tsState.shemes }
  // OR that's how i do
  stateShemes() { return this.$store.getters['shemes'] }
}

更新

因此，您可以使用计算变量从状态中获取一些价值。您不能仅仅从存储在data（）块中的值中分配值。因此，您应该在安装前进行操作。这样，如果您有一个shemes变量的监视者，则不会在分配计算值时触发。如果将其放在mount（）挂钩中，观察者将触发。

还可以解释为什么使用此调用this.tsState.shemes而不是this.$store.getters.shemes吗？

如何将数据从Vuex状态克隆到本地数据？

3 个答案: