无法将文件放入 redux 数组答案

【问题标题】：can not put file in redux array无法将文件放入 redux 数组
【发布时间】：2020-05-05 21:54:20
【问题描述】：

我在 redux 数组中上传文件，它似乎正在获取文件作为有效负载，因为它登录到控制台，但是当我将它推送到数组中时，它会放置空对象而不是实际文件，我没有遇到这个问题，所以我做了不知道该怎么做，这里是代码：

const uploadImage = (e) => {
  const files = e.target.files;
  console.log(files)
  for(const file of Array.from(files)){
     console.log(file)
     dispatch({
       type: UPLOAD_IMAGE,
       payload: file
     });
  };
};

减速器：

case UPLOAD_IMAGE:
  console.log(action.payload)
  return {
    ...state,
    images: [...state.images, action.payload]
  }

这里是有效载荷

这里是 redux devtools 扩展

【问题讨论】：

v4.0.4 和 redux-thunk v2.3.0

标签： arrays reactjs file redux react-redux

【解决方案1】：

首先，您必须为Redux 创建新对象。我不知道细节，但是将File/Blob 放到Redux 并不能像处理 JS 对象那样工作。如果您有更好的解决方案，请与我分享）

    const file = document.querySelector<HTMLInputElement>(`#file`);
    const blob = file.files[0];
    const blobForRedux = {};

    [
        'lastModified',
        'lastModifiedDate',
        'name',
        'path',
        'preview',
        'size',
        'type',
        'webkitRelativePath',
    ].map((key) => {
        blobForRedux[key] = blob[key];
    });

【讨论】：