无法在 MERN 堆栈网络应用程序中通过 axios 发布图像

如何解决无法在 MERN 堆栈网络应用程序中通过 axios 发布图像

我创建了一个 api 端点，它接收包括图像数组在内的数据。当我用邮递员检查 api 时，它工作得很好，然后我尝试将它与使用 axios 在 reactjs 中开发的前端集成。但是所有其他数据都完美地到达终点，而不是图像和数组。图像以及数组在终点显示为空。我该如何解决这个问题？

这是api

router.post("/:categoryId",uploadImges.array('image',10),async(req,res) => {
let cId= await Category.findOne({_id:req.params.categoryId});
console.log(cId.categoryName)
console.log(req.body)
// console.log(uploadImgs)
files=req.files;
if(!files)
{
    res.status(500).send("no file selected")
    console.log("no file selected")
}
else
{    
    let imgArray=[];
    files.map((src,index)=>{
                               
                                let img=fs.readFileSync(files[index].path);
                                let imgBase64=img.toString("base64");                             
                                

                                imgArray.push(
                                              {imgPath:files[index].path,imageBase64:imgBase64,contentType:files[index].mimetype})
                                               }
                                             )
                                 console.log(imgArray)
    if(cId.categoryName=="Kids wear")
    {
        const KidsWear = new kidswear({
            ...req.body,categoryId: req.params.categoryId,Productimage: imgArray,});
        
        try{
            await KidsWear.save()
            res.status(200).send(KidsWear)
        }
        catch(e){
            res.status(500).send(e.message)
            console.log(e.message)
        }
    }
    else if(cId.categoryName=="Toys")
    {
        const Toys = new toys({
            ...req.body,});
        
        try{
            console.log(Toys)
            await Toys.save()
            res.status(200).send(toys)
        }
        catch(e){
            res.status(500).send(e.message)
            console.log(e.message)
        }
    }
    else if(cId.categoryName=="Mens Wear")
    {
        const MensWear = new menswear({
            ...req.body,});
        
        try{
            await MensWear.save()
            res.status(200).send(MensWear)
        }
        catch(e){
            res.status(500).send(e.message)
            console.log(e.message)
        }
    }
    else if(cId.categoryName=="Ladies wear")
    {
        const LadiesWear = new ladieswear({
            ...req.body,});
        
        try{
            await LadiesWear.save()
            res.status(200).send(LadiesWear)
        }
        catch(e){
            res.status(500).send(e.message)
            console.log(e.message)
        }
    }
    else if(cId.categoryName=="Electronic items")
    {
        const Electronics = new electronics({
            ...req.body,});
        
        try{
            await Electronics.save()
            res.status(200).send(Electronics)
        }
        catch(e){
            res.status(500).send(e.message)
            console.log(e.message)
        }
    }
    
    
}


});

前端

let addProduct=()=>
{
let formData = new FormData();
console.log(selectedfiles)

formData.append('ProductName',productName);
formData.append("ProductPrice",productPrice);
formData.append("ProductDescription",Details);
formData.append("Quantity",qty);
// sizes.map((s)=>{
//   formData.append("productSize",s,s);
// })
formData.append("productSize",sizes);
formData.append('image',selectedfiles);

axios.post(`http://localhost:4000/product/`+catid,formData,{headers:{'Content-Type': 'multipart/form-data'}}).then(res => 
                                            {
                                                console.log(res.data)
                                                
                                              })
 }