[英]Create unique array while push Object to array in react useState hook
[英]Push Object to array in react useState hook
我声明如下反应状态
const [selectedFiles, setselectedFiles] = useState([]);
在功能中使用它们,如下所示
function handleAcceptedFiles(files) {
files.map((file) =>
Object.assign(file, {
preview: URL.createObjectURL(file),
formattedSize: formatBytes(file.size),
})
);
setselectedFiles(files);
}
我正在尝试添加如下但不起作用
selectedFiles.length === 0 ? setselectedFiles(files) : setselectedFiles(oldFiles => [...oldFiles,files])
但这对我没有帮助。
您可能在前一个数组上设置了具有相同引用的setselectedFiles
,这不会导致任何更改,因此将其克隆到一个新数组(我通过传播进行克隆)
function handleAcceptedFiles(files) {
files.map((file) =>
Object.assign(file, {
preview: URL.createObjectURL(file),
formattedSize: formatBytes(file.size),
})
)
setselectedFiles([...files])
}
你在做setselectedFiles(oldFiles => [...oldFiles,files])
这会将数组作为新元素添加到现有数组中,如下所示
let array = [1,2,3];
let array2 = [4,5,6];
let output= [...array,array2]
console.log(output) // [1,2,3,[4,5,6]]
// change the output which concat 2 arrays using spread
output= [...array,...array2];
console.log(output) // [1,2,3,4,5,6]
所以对于你的解决方案替换
setselectedFiles(oldFiles => [...oldFiles,files])
经过
setselectedFiles(oldFiles => [...oldFiles,...files])
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.