React Hooks - 无法获取更新的状态值

Question

我的上传状态有问题。我没有获得反应钩子状态的更新值。如果我在 fileOnProgress(( 中添加了 console.log((，我会得到 uploadStatus 状态的 [] 值。

我尝试将上传状态状态放在 useEffect 中，但发生了无限循环，因为状态也在函数内部更新。

注意：在这种情况下，上传状态已经从其他函数填充，这就是我希望获得更新值的原因。

import React, { useEffect, useState } from 'react';
function Dropzone {
  const [ uploadStatus, setUploadStatus ] = useState([]);
  const [ resumableFiles, setResumableFiles ] = useState([]);
  const resumableListener = () => {
      if (resumableFiles.length === 0) return;
      resumableFiles.map(resumable => {
          resumable.on('progress', () => {
              fileOnProgress(resumable);
          });
          resumable.on('fileError', (error) => {
              console.log(error)
          });
      });
  };
  const fileOnProgress = (resumable) => {
      const file = resumable.files[0];
      const size = (file.size / 1048576).toFixed(2);
      const progress = (resumable.progress() * 100).toFixed(2).toString() + '%';
      const cont = [...uploadStatus];
      cont.map(d => {
          if (d.id === file.uniqueIdentifier) {
              d.status = progress;
          }
      });
      setUploadStatus(cont);  
  };
  useEffect(() => {
      resumableListener();
  }, [resumableFiles]);
  ...
}

Answer 1

Array.map返回一个新数组，所以尝试：

  const newCont = cont.map(d => {
      if (d.id === file.uniqueIdentifier) {
          d.status = progress;
      }
      return d;
  });
  setUploadStatus(newCont); 

正如@go_diego所指出的，您也错过了地图中的返回。

MDN 文档供参考