I am using the laravel 6.0 and vue js
I am try to upload and save image into the database but we are always getting this error.
Images Upload and Saved
<form
@submit.prevent="imagesform" enctype="multipart/form-data"
@keydown="errors.clear($event.target.images)">
Attach a picture
![]()
Submit
class Errors{
constructor(){
this.errors = {};
}
get(field){
if (this.errors[field]) {
return this.errors[field][0];
}
}
record(errors){
this.errors = errors.errors;
}
clear(field){
delete this.errors;
}
}
export default {
data(){
return{
showPreview: false,
imagePreview: '',
name:'',
gander:'',
errors: new Errors()
}
},
methods:{
imagesform: function(e) {
e.preventDefault();
alert('Hellow');
let vueInstance = this;
const config = {
headers: { 'content-type': 'multipart/form-data' }
}
let formData = new FormData();
formData.append('images', this.imagePreview);
axios.post('/company/public/saveimages', formData, config)
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
//currentObj.output = error;
});
},
handleFileUpload(e){
this.imagePreview = e.target.files[0];
/*
this.file = this.$refs.file.files[0];
*/
let reader = new FileReader();
reader.addEventListener("load", function () {
this.showPreview = true;
this.imagePreview = reader.result;
}.bind(this), false);
if( this.imagePreview ){
if ( /\.(jpe?g|png|gif)$/i.test( this.imagePreview.name ) ) {
reader.readAsDataURL( this.imagePreview );
}
}
},
},
mounted() {
}
}
public function saveimages(Request $request){
$validator = Validator::make($request->all(), [
'images' => 'required',
]);
$data = $request->only(['images']);
if(!empty($data['images'])){
$imageName = time().'.'.$request->picture->getClientOriginalExtension();
$request['images'] = $imageName;
$request->picture->move(public_path('msg'), $imageName);
}
if ($request->hasFile('images')) {
$filenamewithExt = $request->file('images')->getClientOriginalName();
$filname = pathinfo($filenamewithExt,PATHINFO_FILENAME);
$extension =$request->file('images')->getClientOriginalExtension();
$filenametostore = $filname.'_'.time().'.'.$extension;
$path =$request->file('images')->storeAs('public/cover_images',$filenametostore);
}
images::create($request->all());
return response()->json(['success' => $imageName]);
}
Route::post('/saveimages', 'EmployeesController@saveimages')->name('saveimages');
After that Iam getting this error on the browser
message: "Call to a member function getClientOriginalExtension() on null"
exception: "Symfony\Component\Debug\Exception\FatalThrowableError"
file: "C:\xampp\htdocs\company\app\Http\Controllers\EmployeesController.php"
