2

我正在使用 Vuelidate 验证一个 vue 表单，并且在尝试编辑它时出现以下错误：

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

这是我的表单输入结构：

<hp-text-input
  id="company-name"
  v-model.trim="$v.formData.companyName.$model"
  :code="$v.formData.companyName.$model"
  :v="$v.formData.companyName"
  :disabled="formData.loading"
  :labeltext="$t('components.add_address_modal.company')"
  name="company-name"
></hp-text-input>

这是我的状态：

data() {
  return {
    formData: {
      country: 'Ireland',
      address: '',
      addressAdditional: '',
      addressType: '',
      city: '',
      companyName: '',
      firstName: '',
      lastName: '',
      zipCode: '',
    },
  }
},

这些是我的 Vuelidate 验证：

validations() {
  return {
    formData: {
      country: {},
      address: { required, max: maxLength(32) },
      addressAdditional: { max: maxLength(32) },
      addressType: { required },
      city: { required },
      companyName: {},
      firstName: { required },
      lastName: { required },
      zipCode: { required, max: maxLength(10), zipValidate },
    },
  }
},

我确实在这个组件中使用了 vuex 存储，但它甚至与表单数据本身无关。目前唯一可以消除错误的方法是创建一个副本并将formData其传递给表单，这对我来说没有任何意义。

你有什么建议吗？

4

0 回答 0