Validate child components

Versions

• vee-validate: 2.2.10
• vue: 2.6.10

Describe the bug If I add a component to my form, which has an input that should be required, the validation result is always true.

To reproduce

This is from the parent component:

 <component
    :name="'field-value'"
    v-model="newField.value"
    :is="newField.value">
</component>

This is the child component:

<template>
        <b-input
                :id="'form-'+name"
                :name="'form-'+name"
                type="number"
                v-validate="'required|numeric'"
                :state="errors.has('form-modal.form-'+name) ? 'invalid' : ''"
                :value="value"
                v-on:input="$emit('input',$event)"/>
</template>
<script>
export default {
	name: 'Integer',
	inject: ['$validator'],
	props: ['name', 'value'],
}
</script>

This is the parent validation:

this.$validator.validateAll ('form-modal').then ((result) => {

	if (result) {
		//do stuff
		this.$validator.reset ();
		this.$refs.modal.hide ();
	}
});

Expected behavior If the field is empty, no error is being shown. All other validations in the modal are working fine.

[Loremaster]

@pwgardipee did you find a solution?

[pwgardipee]

@logaretm How can I use ValidationProvider and ValidationObserver to do the validation on a child from the parent? I have recently migrated to v3.