2

我将 vuedraggable 与 Vuex 存储一起使用,文档建议每个组件都应具有直接指向数组的 v-model 属性,因此可以通过 setter 更改 Vuex 存储。

问题是:我正在动态地将新数组添加到存储中,并在模板中使用 v-for 循环访问它们。在 v-for 中有标签,我使用方括号语法从列表中访问正确的数组。它会渲染数据,但在这种情况下,v-model 无法改变“listOfArrays [index]”下没有设置器的状态。

我试图通过直接分配动态数组来存储具有随机生成的名称的属性,并拥有一个包含属性名称列表的数组来解决它,但是改变它们的问题仍然存在。显然我对此有错误的想法。

我想要实现的是:有一种方法可以将新数组添加到 $store,然后使用组件状态提交突变。我希望指出正确的方向,或者可能是替代解决方案。

<template>
 <div v-for="(array, index) in listOfArrays">
  <draggable v-model="listOfArrays[index]"> ..data... </draggable>
 </div>
</template>

<script lang="ts">
 get listOfArrays() {
  return this.$store.getters.listOfArrays;
 }

 set listOfArrays(value) {
  this.$store.commit('updateListOfArrays', value);
 }
</script>
4

0 回答 0