javascript - 在 Store.js 中使用插件 (VeeValidate)

Question

我正在使用 Vuex 并添加了 vee-validate ( found here )。我正在使用一个存储对象，并且从它的一个操作中，我希望能够根据服务器响应将自定义错误添加到错误集合中。是否可以访问通常用作属性的 vee-validate 全局 errors (ErrorBag) 集合？

根据 this ，我应该能够添加到错误对象中，但是当我在我的存储对象中时 this 显然不一样。

例如:

<span id="error-message" v-if="errors.has('phone')">error message</span>

我希望有一种方法可以访问 errors 集合。有没有一种方法需要导入 VeeValidate 才能访问我需要的内容？它是否以某种方式在全局范围内可用？

Answer 1

我建议将操作中引发的错误添加到存储中，并在组件中通过计算属性进行访问。

这遵循单向数据流原则，并且由于计算的是响应式(Reactive)的，因此应该为 View 提供异步更新的机会。

也许:

<span id="error-message" v-if="allErrors.has('phone')">error message</span>

computed: {
  allErrors() {
    return this.$validator.errors
      .concat( this.$store.state.asyncErrors )
}

需要充实细节。