سلام دوستان من میخوام وقتی کسی عکسی خواست آپلود کنه سایز تصویر ۱۵۰*۱۵۰ باشه در vuejs , laravel ولی نمیدونم چه کدی بنویسم برای برسی سایز تصویر لطفا کمکم کنید.
<template>
<div>
<input type="file" :id="id" @change="onFileChang($event)" accept="image/*"><button class="btn btn-info btn-sm" type="button" @click="upload()" v-if="num > ۰">ارسال</button>
<span class="text-danger" v-text="message"></span>
<div class="container">
<div class="row">
<div :class="[num > ۱ ? 'col-۳':'col-۱۲']" v-for="(image , index) in images">
<button class="close" type="button" @click="removeimg(index)"><i class="fas fa-times"></i></button>
<img :src="image" class="img-fluid">
</div>
<input type="hidden" :name="name" :value="images">
</div>
</div>
</div>
</template>
<script>
export default {
name: "uploadImage",
props:['name','id' , 'image' , 'num','url' , 'checking'],
data(){
return{
pic: null,
images:[],
uploadUrl:'',
message:'',
}
},
mounted(){
if (this.image)
{
this.images = this.image.split(",");
this.num = this.num - this.images.length;
}
this.uploadUrl = this.url;
},
methods:{
onFileChang(event)
{
if (!this.checking)
this.pic = event.target.files[۰];
else{
// چک کردن سایز تصویر ۱۵۰*۱۵۰
}
},
upload()
{
let formData = new FormData();
formData.append('images' , this.pic);
this.message = '';
if (this.pic != null && this.num > ۰)
{
axios.post(this.uploadUrl , formData)
.then(response => {
this.images.push(response.data);
this.num--;
}).catch(errors => {
this.message = 'مشکلی رخ داده است لطفا دوباره امتحان کنید.'
});
}
else{
this.message = 'تصویر را انتخاب کنید';
}
},
removeimg(id)
{
this.images.splice(id , ۱);
this.num++
}
}
}
</script>
به جای این کار که اگر غیر از ۱۵۰ پیکسل بود ارور بده، بهتر نیست که عکس رو اول دریافت کنید و بعد خودتون برش بزنید و به اندازه دلخواهتون تبدیلش کنید...؟
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟