Marcelo Cortes
Marcelo Cortes
Comparte:

Error 422 en metodo store

Hola Jorge, primero muchas gracias por los cursos han sido de mucha utilidad, he aprendido mucho y cada día me motivan a hacer cosas nuevas. tengo el siguiente problema.
Estoy ingresando un usuario desde un componente vuejs, el metodo de envio hacia el controlador es el siguiente:
axios.post(`/api/users/store`, this.newUser).then(response => { ...
al enviar el formulario y si todos los campos van correctos el registro ingresa sin ningun problema, el tema es que al hacer la validación y encontrar algun error por ejemplo el campo password es obligatorio, laravel me envia un codigo de error 422 (Unprocessable Entity), al revisar en la consola vuejs de chrome efectivamente recibo los errores en la variable errors del catch de la llamada axios, pero por alguna razon no esta desplegando los errores en los campos del formulario como control de errores.
adjunto el codigo de la funcion addUser  
addUser(){
                if (!this.submiting) {
                    this.submiting = true
                    const loading = this.$loading({
                        lock: true,
                        text: 'Ingresado usuario',
                        spinner: 'el-icon-loading'
                    })
                    axios.post(`/api/users/store`, this.newUser).then(response => {
                        this.submiting = false
                        this.getUsers()
                        setTimeout(() => {
                            loading.close()
                        }, 1000)
                        this.newUser = {}
                        this.newUserVisible = false
                        this.$message({
                            message: 'Usuario ingresado con Exito.',
                            duration: 2000,
                            offset: 400,
                            type: 'success'
                        })
                    })
                    .catch(error => {
                        if (!error.response.data.errors){
                            this.errors = error.response.data.message
                            this.$message({
                                showClose: true,
                                type: 'error',
                                duration: 5000,
                                offset: 400,
                                dangerouslyUseHTMLString: true,
                                message: '<h1><i class="fas fa-exclamation-triangle"></i> Houston, We have a problem!. <i class="fas fa-exclamation-triangle"></i></h1><br /><br />Error: ' + this.errors
                            })
                            this.submiting = false
                            setTimeout(() => {
                                loading.close()
                            }, 1000)
                        } else {
                            this.errors = error.response.data.errors
                            this.$message({
                                //showClose: true,
                                type: 'error',
                                duration: 5000,
                                offset: 400,
                                dangerouslyUseHTMLString: true,
                                message: '<h1><i class="fas fa-exclamation-triangle"></i> Houston, We have a problem!. <i class="fas fa-exclamation-triangle"></i></h1><br /><br />Error: <pre>' + this.errors + '</pre>'
                            })
                        }
                        this.submiting = false
                    })
                }
            }
y este es el codigo del metodo store del controlador.
public function store(Request $request){

        $this->validate($request,[
            'name' => ['required', 'string', 'max:255'],
            'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
            'password' => ['required', 'string'],
        ]);

        $user = User::create([
            'name' => $request->name,
            'email' => $request->email,
            'password' => Hash::make($request->password),
        ]);

        return $user;

    }
y este es el codigo de los campos del formulario.
<div class="card-body">
                            <div class="row">
                                <div class="col-sm-5">
                                    <div class="form-group">
                                        <label>NOMBRE</label>
                                        <input type="text" name="name" class="form-control" :class="{'is-invalid': errors.name}" v-model="newUser.name">
                                        <div class="invalid-feedback" v-if="errors.name">{{errors.name[0]}}</div>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>CORREO</label>
                                        <input type="text" name="email" class="form-control" :class="{'is-invalid': errors.email}" v-model="newUser.email">
                                        <div class="invalid-feedback" v-if="errors.email">{{errors.email[0]}}</div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>CONTRASEÑA</label>
                                        <input type="password" name="password" class="form-control" :class="{'is-invalid': errors.password}" v-model="newUser.password">
                                        <div class="invalid-feedback" v-if="errors.password">{{errors.password[0]}}</div>
                                    </div>
                                </div>
                            </div>
                        </div>
lo estoy haciendo en Laravel 7 por si es un dato importante. desde ya muchas gracias por tu ayuda.
Saludos