Как проверить, является ли вход дочернего компонента $ недействительным

Question

Мне нужно проверить, является ли один вход дочернего компонента действительным. Но я не знаю, как сделать это из компонента отца.

У меня есть форма с несколькими полями и их проверкой. Для упрощения я переместил каждое поле ввода и его проверки в его собственные компоненты. Но теперь мне нужно проверить их все вместе.

Как я могу это сделать?

Я поместил живую выборку на codeandbox:

https://codesandbox.io/embed/vuetify-playground-o7kbr?fontsize=14

Answer 1

сделать ссылку на вход

<input-cpf ref="input" label="CPF" :cpf.sync="cpf"/>

и затем вы можете получить доступ к компоненту из родительского

this.$refs.input.$v.$touch();
if ( this.$refs.input.$v.cpf.$invalid ) {
    console.log('não esta pronto para enviar')
} else {
    console.log('pode enviar')
}