Как получить данные в массив после публикации, используя axios в reactjs
Я создаю альбом, используя reactjs. Я использую loopback-storage-connector для хранения изображений.
это мой код для загрузки изображения
fileUploadCarImg =()=>{
for (let index = 0; index < this.state.file.length; index++) {
const element = this.state.file[index];
const fd = new FormData();
fd.append('image2',element,element.name )
axios.post('http://localhost:3000/api/attachmentBanks/Car_Image/upload',fd , {
onUploadProgress : ProgressEvent => {
console.info('Upload Progress: ' + Math.round(ProgressEvent.loaded / ProgressEvent.total *100) + '%')
}
})
.then(res => {
console.info(res.data.result.files.image2[0].name)
});
}
}
Я хочу сохранить эти имена изображений в loopback-mysql-connector. поэтому моя идея состоит в том, чтобы хранить каждое имя изображения (res.data.result.files.image2[0].name) в массиве.
при загрузке изображения console.info(this.state.file) печать
Array(8) [ File, File, File, File, File, File, File, File ]
(8) […]
0: File { name: "IMG_20150905_072534.jpg", lastModified: 1442772056000, size: 241381, … }
1: File { name: "IMG_20151110_115108.jpg", lastModified: 1447206282000, size: 2749010, … }
2: File { name: "IMG_20151110_115124.jpg", lastModified: 1447206242000, size: 2797533, … }
3: File { name: "IMG_20151110_120625.jpg", lastModified: 1447205916000, size: 725661, … }
4: File { name: "IMG_20151110_120642.jpg", lastModified: 1447206122000, size: 687308, … }
5: File { name: "IMG_20151110_120704.jpg", lastModified: 1447205958000, size: 3364141, … }
6: File { name: "IMG_20151110_121043.jpg", lastModified: 1447205998000, size: 2921138, … }
7: File { name: "IMG_20151110_121050.jpg", lastModified: 1447206044000, size: 3867974, … }
length: 8
<prototype>: [
Мне просто нужно сохранить имя изображения. Кто-нибудь, пожалуйста, подскажите, как решить мою проблему?
Ответы 2
Я предлагаю использовать функцию Массив.прототип.карта():
const names = res.data.result.files.map((file) => file.image2[0].name);
Массив довольно сложно расшифровать, но с небольшими корректировками он должен работать.
Да, просто поместите его туда, где вы зарегистрировали результат
сэр, но мой код console.info(names) ничего не отображает
Не могли бы вы предоставить схему для объекта, который вы получаете? Возможно, вам будет проще помочь вам таким образом.
Пожалуйста, отредактируйте свой вопрос и добавьте туда эту информацию. Вопросы на этом сайте должны содержать всю доступную информацию.
сэр . когда я запускаю console.info('Прогресс загрузки:' + Math.round(ProgressEvent.loaded/ProgressEvent.total *100) + '%') только печатается.
Сэр, пожалуйста, проверьте это сейчас
Пожалуйста, рассмотрите возможность использования await
let data = [];
for (let index = 0; index < this.state.file.length; index++) {
const element = this.state.file[index];
const fd = new FormData();
fd.append('image2',element,element.name )
try {
const res = await axios.post('http://localhost:3000/api/attachmentBanks/Car_Image/upload',fd , {
onUploadProgress : ProgressEvent => {
console.info('Upload Progress: ' + Math.round(ProgressEvent.loaded / ProgressEvent.total *100) + '%')
}
});
data.push(res.data.result.files.image2[0].name);
} catch(error) {
//your handler
}
}
спасибо, сэр, но мне написать ваш код под ним, а затем часть в axios?