![](/img/trans.png)
[英]formData is setting empty file variable set from state after using append method on formDate in reactjs using axios
[英]Sending FormData from ReactJs to NodeJs controller using axios
我有以下格式的 JS object,我想在后端發送。 我已經實現了一些代碼,但在 nodeJs controller 它說hotel is undefined
。 我的書面代碼如下:
let hotel = new FormData();
hotel.append('name', data.append);
hotel.append('slug', data.slug);
hotel.append('logo', data.logo);
hotel.append('coverAvatar', data.coverAvatar);
hotel.append('designs', [{ name: `${+new Date()}`, url: localStorage.getItem('initialDesign') }])
hotel.append('products', [...selectedVariants]);
axios.post(`${baseURL}/hotel`, { hotel },{
headers: {
'Authorization': localStorage.getItem('_AUTH_TOKEN'),
'Content-Type': 'multipart/form-data'
}})
.then(response => {
console.log({ response });
})
.catch(err => {
console.log('err', err);
})
我正在使用 multipart/form-data 因為 logo 和 coverAvatar 是<input type='file' />
的 output
我的數據格式
{
"name": "preshan hotel 2",
"logo": {file},
"coverAvatar": {file},
"romms": [{
"name": "tempDesign",
"url": "https://picsum.photos/600/800"
}],
"facilities": [
{ "facilityId": "61ceb3931b1b68fe90827f23", "facilityMappings": ["61ceb39b1b1b68fe90827f2c", "61ceb39b1b1b68fe90827f41"] },
{ "facilityId": "61ceb3ca1b1b68fe90827f47", "facilityMappings": ["61ceb3ca1b1b68fe90827f50","61ceb3ca1b1b68fe90827f58", "61ceb3ca1b1b68fe90827f56"] },
{ "facilityId": "61ceb3e41b1b68fe90827f5d", "facilityMappings": ["61ceb3e41b1b68fe90827f5f"]}
]
}
您應該直接傳遞您的表單數據,而不是傳遞 object。
在您的示例中,它看起來像這樣:
...
axios.post(`${baseURL}/hotel`, hotel,{
...
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.