May I know how to upload files by using Axios?
I want to upload an image to storage/app/public/logo whenever users submit the form with other relevant details.
Whenever I pass all the value to controller by using Axios, $request->file('logo')->store('logo') shows Call to a member function store() on null
SOLUTION
add.js
const vue = new Vue({
...
methods: {
createItem() {
axios.defaults.headers.common["X-CSRF-TOKEN"] = document
.querySelector('meta[name="csrf-token"]')
.getAttribute("content");
let formData = new FormData();
formData.append('name', this.create.name);
formData.append('email', this.create.email);
formData.append('website', this.create.website);
formData.append('address', this.create.address);
formData.append('postcode', this.create.postcode);
formData.append('logo', document.getElementById('logo').files[0]);
axios
.post("/api/company/add", formData)
.then(response => {
if (response.data.result === true) {
toastr.success(this.create.name + " added successfully");
} else {
toastr.danger("Failed to create new company");
}
})
.catch(response => {});
},
}
}).$mount("#company");
Controller.php
public function store(Request $request)
{
$this->validate($request, [
'image' => 'image64:jpeg,jpg,png',
'name' => 'required',
'email' => 'required',
'website' => 'required',
'address' => 'required',
'postcode' => 'required'
]);
$result = Company::create([
'logo' => $request->logo,
'name' => $request->name,
'email' => $request->email,
'website' => $request->website,
'address' => $request->address,
'postcode' => $request->postcode
]);
if ($result) {
if ($request->hasFile('logo') && $request->file('logo')->isValid()) {
$request->file('logo')->store('logos');
}
return ['result' => true];
} else {
return ['result' => false];
}