根据您的观点，我能够获得在应用程序中获取头像/图像的最重要部分……将其推送到数据库（在我的情况下为MongoDB，图像也被添加到我的服务器文件夹中）。

但是我无法工作的是触发成功的模式或页面上图像的渲染，这对于response.status === 200和response.ok === true来说很奇怪吗？我在Express中使用Multer。 （我正在使用访存）。

这是我的ImageLoader组件：

import React,{ Component } from 'react';
import './ImageUploader.css';
import Modal from '../Modal/MyModal.jsx'

import DefaultImg from '../../static/profile-avatars/assets/default-img.jpg';

import { connect } from 'react-redux'
import { bindactionCreators } from 'redux'
import { modalStateon,modalStateOff } from '../../store/index'

    const API_URL = "http://localhost:8016";

class ImageUploader extends Component {
  constructor(props) {
    super(props);

    this.state = {
      multerImage: DefaultImg,}
  }

  setDefaultImage(uploadType) {
    if (uploadType === "multer") {
      this.setState({
        multerImage: DefaultImg
      });
     }
    }

  uploadImage(e,method) {
   var { history,isLoggedIn,modalactive,modalStateon,modalStateOff  } = this.props

    let imageObj = {};

    if (method === "multer") {

      let imageFormObj = new FormData();

      imageFormObj.append("imageName","multer-image-" + Date.now());
      imageFormObj.append("imageData",e.target.files[0]);

      // stores a readable instance of
      // the image being uploaded using multer
      this.setState({
        multerImage: window.URL.createObjectURL(e.target.files[0])
      });

     return window.fetch('http://localhost:8016/images/uploadmulter',{
       method: 'POST',// body: e.target.files[0]
        body: imageFormObj
      })
       .then((response) => {
         console.log("response ",response);
         this.setDefaultImage("multer");
        return (
         <>
          {response.ok && <Modal
           isAlertModal={true}
           history={history}
           affirmativeUsed="Yes"
           message="Image has been successfully uploaded!"
           isLoggedIn={isLoggedIn}
           modalactive={true}
           modalStateon={modalStateon}
           modalStateOff={modalStateOff}></Modal>}
         </>
        )

        })
       .then((data) => {
        console.log("data ",data);

        this.setDefaultImage("multer");

       })
      .catch(error => {
       this.setDefaultImage("multer");
       console.log("error ",error);

      })

     }
  } // end upload function

  render() {
   // console.log("uploadImage function this.props ",this.props);
    return (
      <div classname="main-container">
        <h3 classname="main-heading">Image Upload App</h3>

        <div classname="image-container">
          <div classname="process">
            <h4 classname="process__heading">Process: Using Multer</h4>
            <p classname="process__details">Upload image to a node server,connected to a MongoDB database,with the help of multer</p>
           <form action="/uploadmulter" method="post" encType="multipart/form-data" >
              <input type="file" name="avatar" classname="process__upload-btn" onChange={(e) => this.uploadImage(e,"multer")} />
              <img src={this.state.multerImage} alt="upload-image" classname="process__image" />
            </form>
          </div>
        </div>

      </div>
    );
  }
}

function mapstatetoProps(state) {
 const { isLoggedIn,modalactive } = state
 return { isLoggedIn,modalactive }
}

const mapDispatchToProps = dispatch =>
 bindactionCreators({ modalStateon,modalStateOff },dispatch)

export default connect(mapstatetoProps,mapDispatchToProps)(ImageUploader)

这是我的快递服务器server/images/index.js上的路由：

var router = require('express').Router();
var Image = require('../models/Image');
var multer = require('multer')

var storage = multer.diskStorage({
  destination: function(req,file,cb){
   cb(null,'./server/uploads/');
  },filename: function(req,Date.now() + file.originalname)
  }
})

var fileFilter = (req,cb) => {
 if (file.mimetype === 'image/jpeg' || file.mimetype === 'image/png') {
  cb(null,true);
 } else {
  // rejects storing a file
  cb(null,false)
 }
}

var upload = multer({
 storage: storage,limits : {
  fileSize : 1024 * 1024 * 5
 },fileFilter: fileFilter
})

router.route('/uploadmulter')
 .post(upload.single('imageData'),(req,res,next) => {
   console.log('req.body',req.body);
   var newImage = new Image({
    imageName: req.body.imageName,imageData : req.file.path
   })

   newImage.save()
   .then(result => {
    res.status(200).json({
      success: true,document:result
    })
   })
   .catch(err=> next(err))
  });

  module.exports = router

所以要重申为什么在响应为true或200时图像不渲染和模态触发？