gpt4 book ai didi

javascript - 为什么 JavaScript 传播符号在这里不起作用

转载 作者:行者123 更新时间:2023-12-02 02:13:57 25 4
gpt4 key购买 nike

我正在学习 React,但有一个我无法解决的简单问题。

我创建了一个 Codesandbox

图中:文件 是一个键值数组,如图片所示。

enter image description here

下面这段代码运行后:

return { ...file, md5: SHA256(fileContents).toString() };

然后结果是键值对被删除,如下图所示:

enter image description here

如您所见,该文件现在仅包含 pathmd5,其他所有内容均已消失。

我知道这可能与浅拷贝原则有关,但我已经在寻找解决方案,但不明白如何解决这个问题。

const FilePicker = ({ setNewFileForValidation }) => {
const readFileContents = async file => {
return new Promise((resolve, reject) => {
const fileReader = new FileReader();
fileReader.onload = () => {
resolve(fileReader.result);
};
fileReader.onerror = reject;
fileReader.readAsBinaryString(file);
});
};
const readAllFiles = async AllFiles => {
const results = await Promise.all(
AllFiles.map(async file => {
const fileContents = await readFileContents(file);
return { ...file, md5: SHA256(fileContents).toString() };
}),
);
console.log(results, 'resutls');
return results;
};

function onDrop(acceptedFiles, rejectedFiles) {
readAllFiles(acceptedFiles).then(result => {
setNewFileForValidation(result);
});
}
return <Dropzone onDrop={onDrop} />;
};

文件 来自react-dropzone并包含文件选择器的结果。也许这就是这个传播副本不起作用的原因?

最佳答案

文件是一个特殊的对象,它的属性是不可枚举的。因此传播语法没有按预期工作。你需要clone the File object使用文件构造函数。

readAllFiles = async (AllFiles) => {
const results = await Promise.all(
AllFiles.map(async (file) => {
const fileContents = await this.readFileContents(file);
// THIS IS THE PROBLEM
//return { ...file, md5: SHA256(fileContents).toString() };
file = new File([file], file.name, { type: file.type })
file.md5 = SHA256(fileContents).toString();
return file;
})
);
console.log(results, "result");
return results;
};

关于javascript - 为什么 JavaScript 传播符号在这里不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67374630/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com