在表单上启用 VeeValidate

Question

目前我正在尝试在 Laravel 上添加 VeeValidate 组件来验证我的表单，我刚刚安装了带有 NPM 的 Vue，它似乎正在工作，但是如何为 Vue 启用组件？

目前我的 app.js 中有：

window.Vue = require('vue');
window.JQuery = require('jquery');
import Vue from 'vue';
Vue.component('ValidationProvider', require('vee-validate'));

并尝试在视图中调用组件：

        const app = new Vue({
            el:'#app',
            components: {
                ValidationProvider
            },
            data() {
                return {
                    step:1,
                    registration:{
                        firstname:null,
                        lastname:null,
                        email:null,
                        street:null,
                        city:null,
                        state:null,
                    }
                }
            },
            methods:{
                prev() {
                    this.step--;
                },
                next() {
                    this.step++;
                },


            }
        });

控制台说 Validationprovider 未定义...为什么？

Answer 1

ValidationProvider 只是 vee-validate 导出的众多组件中的一个，您需要专门导入它。

import Vue from 'vue';
import { ValidationProvider } from 'vee-validate';

Vue.component('ValidationProvider', ValidationProvider);