如何推送，更新反应功能组件对象中的数组内的元素

【问题标题】：how to push to, update elements inside an array that is in a object of a react functional component如何推送，更新反应功能组件对象中的数组内的元素
【发布时间】：2021-01-04 00:31:41
【问题描述】：

const [Collect, setCollect] = React.useState({
visible: false,
files:[],
uploading: 0,
team:"",
manager:"",
owner:"",
fileNames: [],
status:""

});

function fileOnChange(e){
// here update files and filenames arrays
}

我有一个功能组件，它有一个带有数组的对象，如上所示。每次从输入中选择新文件时，如何更新数组。 fileOnChange 方法更新添加文件和文件名

【问题讨论】：

嗨，你试过什么？您基本上是在要求某人为您编写整个函数。

标签： reactjs react-hooks react-functional-component react-state-management

【解决方案1】：

您可以创建另一个变量来存储以前的文件名和文件

let temp1 = Collect.filenames;
let temp2 = Collect.files;
temp1.push('anotherFilename');
temp2.push('anotherFile');
setCollect({...Collect, filenames: temp1, files: temp2});

【讨论】：

temp 未声明。这似乎也是一个不完整的解决方案。新文件和文件名如何进入状态？
我现在正在使用这种方法....只是想知道是否有更好的方法而不使用推送。如果数组是单独的，那么我可以使用 SetFiles(prevState => [...prevState, newFile]);。我想知道最好的方法是什么
是的，你可以这样做。
如果您使用的是表单，那么您也可以避免使用状态变量。您可以只检索表单提交的数据并将其发送到服务器。