laracasts / Vue-Forms

https://laracasts.com/series/learn-vue-2-step-by-step/episodes/19
396 stars 204 forks source link

uncaugh exception: Object #23

Closed dissolvdgrl closed 4 years ago

dissolvdgrl commented 4 years ago

I keep getting an error in the console: "uncaugh exception: Object". I've been trying to find where this occurs for hours. The form works and errors are displayed in the DOM, but I can't seem to get rid of this error.

The code is pretty much the same as this lesson, but I had to change the submit method in Form.js:

submit(requestType, url) {
        return new Promise((resolve, reject) => {
            axios[requestType](url, this.data())
                .then(response => {
                    console.log(response);
                    this.onSuccess(response.data);

                    resolve(response.data);
                })
                .catch(error => {
                    this.onFail(error.response.data.errors);
                    reject(error.response.data.errors);
                });
        });
    }

Any ideas?

dissolvdgrl commented 4 years ago

I seemed to have made the error go away. What I did was that I forgot (silly, tired me) to add an event to the inputs that clears the errors, for example

<input 
    type="text" 
    name="email" 
    v-model="form.email"
    @keydown="form.errors.clear('email')">

and in my onSubmit method in the Component.vue file that houses the form, I added a catch:

onSubmit() {
                this.form.post('/message').then(response => {
                   console.log(response) ;
                    // todo: show the success response in the DOM
                }).catch(error => {
                    document.querySelector('#submit-btn').setAttribute('disabled', 'disabled');
                });
            }

I hope this helps someone else that has the same error.