vee-validate在父子组件中的依赖注入

发表于 | 分类于

问题

在父组件中可以通过this.$validator.validateAll()来验证所有表单，但是却无法验证子组件中的表单。
它们的报错信息errors对象在各自的组件实例中。如果能让子组件直接使用父组件的验证方法就好了，这样子组件就能直接使用父组件的errors对象。

解决方法

使用依赖注入：

1
2
3
4
5
6
7
8
9
10
11
// Parent Component:
provide () {
    return { parentValidator: this.$validator }
},

// Child Component:
inject: [ 'parentValidator' ],
...
created () {
    this.$validator = this.parentValidator
}