javascript - 如何在 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 给出错误提示，

The computed property "fields" is already defined as a 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部分解释了如何将实例注入(inject)组件而不是全局注入(inject)。