دوستان برای آپلود چندین فایل در ویو برای هرفایل یک input جداگانه در نظر گرفتم ولی میخواهم input ها به صورت داینامیک ایجاد بشه
به این صورت کد زدم
<button @click="addNewDocument"
class="btn m-btn--pill btn-outline-success m-btn m-btn--custom"
type="button">
Add New
</button>
<div v-for="(row,index) in fileArray">
<div class="form-group m-form__group row">
<div class="col-lg-4">
<div class="custom-file">
<input type="file" ref="files" name="files[]" multiple @change="setFile($event, row)" :id="index">
</div>
</div>
</div>
</div>
data() {
return {
fileArray: [],
files: []
}
}
addNewDocument() {
let self = this;
self.fileArray.push(
{
selectFiles: self.files
}
);
},
setFile(event, row) {
let selectedFiles = event.target.files;
row.selectFiles = selectedFiles;
for (let i=0; i < selectedFiles.length; i++){
this.files.push(selectedFiles[i]);
}
for (let i=0; i<this.files.length; i++){
let reader = new FileReader(); //instantiate a new file reader
reader.addEventListener('load', function(){
this.$refs['files' + parseInt( i )][0].src = reader.result;
}.bind(this), false); //add event listener
reader.readAsDataURL(this.files[i]);
}
},
الان مشکل اینحاست وقتی فایل رو انتخاب میکنم این ارور رو دریافت میکنم
Uncaught TypeError: Cannot read property '0' of undefined
این مشکل هم به این خاطر که
let selectedFiles = event.target.files;
باید برابر باشه با
let selectedFiles = event.target.files[0];
وقتی به این صورت باشه هیچ دیتایی در files قرار نمیگیره
ممنون میشم راهنمایی کنید که به چه صورت باید عمل کنم
به vbvb کمک کنید تا مشکل خودش را حل کند؛ اینطور میتوانیم با هم پیشرفت کنیم.
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟