Javascript 从计算结果中动态输入的v模型

因此，当我需要在网站中生成动态表单时，我有一个用例。我正在使用

v-for

对我的表单进行迭代，并在计算属性上使用

v-model

，在Vue文档上声明使用

get（）

或

set（）

是可行的方法，但我收到了一条错误消息

[vuex] do not mutate vuex store state outside mutation handlers.

这是我的代码：

store.js

函数动态（）{
返回{
ini:12
};
}
导出常量状态=（）=>({
信息：[]
});
导出常量突变={
设置消息（状态、值）{
console.log（值）；
state.message=值；
},
setDynamic（状态、值）{
设arr=[]；
for（设i=0；i<2；i++）{
arr.push（dynamic（））；
}
state.message=arr；
}
};

组件.vue

<template>
  <section>
    <div v-for="(item, index) in message" :key="index">
      <input placeholder="Hallo V-Model" v-model="message[index].ini">
    </div>
  </section>
</template>

<script>
import { mapMutations } from "vuex";

export default {
  computed: {
    message: {
      get() {
        return this.$store.state.messages.message;
      },
      set(value) {
        this.$store.commit("messages/setMessage", value);
      }
    }
  },
  methods: {
    ...mapMutations({
      dynamic: "messages/setDynamic"
    })
  },

  beforeMount() {
    this.dynamic();
  }
};
</script>

从“vuex”导入{mapstations}；
导出默认值{
计算：{
信息：{
得到（）{
返回此。$store.state.messages.message；
},
设置（值）{
这是.store.commit（“messages/setMessage”，value）；
}
}
},
方法：{
…地图突变({
动态：“消息/设置动态”
})
},
beforeMount（）{
这个。dynamic（）；
}
};

更具互动性的可以在我的网站上找到。你知道它为什么会抛出错误吗？如何解决这个问题

更新 通过将“strich mode”设置为false来修复它，但是，我仍然不知道在变异之外我在哪里变异状态。仍然需要回答

我将其用作快捷方式，它们提供了更高级别的

get（）

和

set（）

whitin vuejs，因此您可以使用

v-model

我在
消息
上对对象进行了变异，因此我需要在应用新值之前对其进行克隆。在这里，库是如何做到这一点的，这样它就不会在
translations
之外改变你的状态。请发布你的整个代码，你在哪里导入vuex libs？我发布了我的完整代码助手，我还提供了指向你的代码的链接，而不是为我执行的。只要打开代码沙盒，如果你想测试它，就更容易了。如果没有，那么创建一个nuxt应用程序，并用我的代码替换组件和您的应用商店。是的，我理解，但我如何编辑它？