Vee-validate는 항상 true를 반환합니다.

Vee-validate는 항상 true를 반환합니다.

검증할 필드가 2개 있는데 송신 후 항상 validateBeforeSubmit() 메서드로 true를 반환합니다.

Whitout 버튼을 전송하면 정상적으로 동작하며 오류가 반환됩니다.

내가 뭘 잘못하지?

App.vue:

<form @submit.prevent="validateBeforeSubmit">

    <form-input v-on:input="handleTitle" :validate="'required|email'" label="email" labelvalue="email" type="text" placeholder="" name="email" :value="title" classname="form-control" id=""></form-input>
    <form-input v-on:input="handleLink" :validate="'required'" label="Link" labelvalue="Link" type="text" placeholder="" name="link" :value="link" classname="form-control" id=""></form-input>

methods: {
        validateBeforeSubmit() {
            this.$validator.validateAll().then((result) => {
                if (result) {
                    // eslint-disable-next-line
                    alert('Form Submitted!');
                    return;
                }

                alert('Correct them errors!');
            });
        },

Input.vue:

<template>
     <div>
        <div class="form-group">
            <span>{{ errors.first(name) }}</span>
            <label v-if="label" :for="label" v-html="labelvalue"></label>
            <input v-validate="validate" v-on:input="updateValue($event)" :type="type" :placeholder="placeholder" :name="name" :value="value" :class="classname" :id="id">
        </div>
     </div>
</template>

export default {
    props: {
        validate: String,
        type: String,
        placeholder: String,
        name: String,
        value: String,
        classname: String,
        id: String,
        label: String,
        labelvalue: String
    },
    methods: {
        updateValue: function (evt) {
            this.$emit('input', evt)
        }
    }
}

validateAll는 자 컴포넌트를 조사하지 않습니다.부모 검증기를 삽입해야 합니다.더하다inject: ['$validator']에Input.vue파일입니다. 문제를 해결할 수 있을 겁니다.내보내기 블록은 다음과 같습니다.

export default {
    inject: ['$validator'],
    props: {
        validate: String,
        type: String,
        placeholder: String,
        name: String,
        value: String,
        classname: String,
        id: String,
        label: String,
        labelvalue: String
    },
    methods: {
        updateValue: function (evt) {
            this.$emit('input', evt)
        }
    }
}

에 대한 자세한 내용은inject이 참조를 조사할 수 있습니다.

언급URL : https://stackoverflow.com/questions/50231479/vee-validate-returns-always-true