如何在 vue 组件中本地使用 VeeValidate 或任何第三方包

Question

好的，情况就是这样，我正在使用Vue.js 进行 SPA。我在我的一个组件中使用VeeValidate，就像这样在Component1.vue 中说，

import Vue from 'vue';
import VeeValidate from 'vee-validate';

Vue.use(VeeValidate);

export default {
    //...
}

在另一个组件中说Component2.vue 我正在使用vuetable-2，我是这样注册的，

import Vuetable from 'vuetable-2/src/components/Vuetable';

export default {
    components: {
        Vuetable
    },

   //...
}

问题在于VeeValidate 和Vuetable 在内部都依赖于同名的计算属性。当我像Vue.use(VeeValidate); 一样在全球范围内注册VeeValidate 时，如果我从Component1 导航到Component2，Vuetable 会出现错误提示，

计算属性“fields”已经被定义为prop

因为当我登陆 Component1 时，VeeValidate 已经在全球注册了自己。

如果我从与VeeValidate 没有任何依赖关系的任何其他组件导航到Component2，那么它就可以正常工作。

这是我的问题，

如何在本地注册VeeValidate 或Component1.vue 内的任何其他包，以免影响其他组件？就像在components: {} 对象内注册其他组件一样。

Answer 1

Vee validate 允许您通过配置更改字段和错误包名称。它在docs here。

const config = { 
     errorBagName: 'errors', // change if property conflicts 
     fieldsBagName: 'fields',
}

如果有兴趣，advanced configuration 部分也解释了如何将实例注入组件而不是全局。