React项目经验总结及遇到的坑

<img width="40" height="30" src=`data:image/jpg;base64,${xxx}`/>

/**
* 下载资料
* @param {Number} e 当前点击项  name：文件名  format：文件格式  api_url：请求接口
*/
handleDownFile = (event, name, format, api_url) => {
  event.preventDefault();
  event.stopPropagation();
  //开启loading 按钮置灰
  this.setState({
    loadingStatus: true,
    buttonDisabled: true,
  });
  fetch(api_url, {
    method: "get",
    // 下面两行可以不用要
    credentials: "include",
    headers: new Headers({
      "Content-Type": "application/json",
      // 'X-Auth-Token': User.getToken(),
    }),
  })
    .then((response) => {
    response.blob().then((blob) => {
      //关闭loading 按钮恢复正常
      let blobUrl = window.URL.createObjectURL(blob);
      const filename = name + `.${format}`; // 设置文件名称 eg: test.zip
      const aElement = document.createElement("a"); // 获取a标签元素
      document.body.appendChild(aElement);
      aElement.style.display = "none";
      aElement.href = blobUrl; //设置a标签路径
      aElement.download = filename;
      aElement.click();
      document.body.removeChild(aElement);
      this.setState({
        loadingStatus: false,
        buttonDisabled: false,
      });
    });
  })
    .catch((error) => {
    //关闭loading 按钮恢复正常
    this.setState({
      loadingStatus: false,
      buttonDisabled: false,
    });
  });
  };