I am new in nuxt.js. I am trying to upload image using Laravel API but I am facing some errors. I have selected the image file in the file input and when I click the submit button,it shows "Image fled is Required"
error is
{message: "The given data was invalid.",…}
errors: {image: ["The image field is required."]}
message: "The given data was invalid."
my Nuxt View Code
<template>
<v-row justify="center">
<v-col cols="12" sm="6">
<form @submit.prevent="submit">
<v-card ref="form" >
<v-card-text>
<h2 class="text-center"> Register</h2>
<v-divider class="mt-3"></v-divider>
<v-col cols="12" sm="12">
<v-text-field v-model.trim="form.name" type="text" label="Name" outlined autocomplete="off"></v-text-field>
<small class="form-text red--text" v-if="errors.name">{{errors.name[0]}}</small>
</v-col>
<v-file-input v-model.trim="form.image" type="file" label="image" outlined
autocomplete="off"></v-file-input>
<small class="form-text red--text" v-if="errors.image">{{errors.image[0]}}</small>
</v-col>
</v-card-text>
<v-card-actions>
<div class="text-center">
<v-btn rounded type="submit" color="primary" dark>Register</v-btn>
</div>
</v-card-actions>
</v-card>
</form>
</v-col>
</v-row>
</template>
< script >
export default {
data() {
return {
form: {
name: '',
image: '',
}
}
},
methods: {
async submit() {
await this.$axios.$post('/Businessregister', this.form)
this.$router.push('/')
}
}
}
<
/script>
Laravel API
Route::group(['middleware' => 'auth:api'], function() {
Route::post('/Businessregister', 'RegisterController@register')->name('Businessregister');
});