当存在未知数量的输入时，如何从Material UI输入中获取值

Question

我正在创建一个表单，用户可以在其中添加文档。每个文档有6个输入(选择、文本输入、日期输入、文件输入(。用户可以添加任意数量的文档，例如：有些用户需要添加4个文档，有些则需要添加-20个甚至更多。

因此，当我无法将值设置为状态时，我正试图弄清楚如何从所有输入中获取值。

我正在使用Material UI，也许有简单的方法来获取值吗？

Answer 1

这被称为受控输入

为了使这种动态，你可以将状态设置为一个对象，然后只需设置state，根据需要添加密钥

const[inputValues，setInputValues]=useState(｛｝(；

const-handleChange=(inputId(=>(e( =>设置输入值({…inputValues，[inputId]：e.target.value})

<输入value=｛inputValues[inputId]｝onChange｛handleChange(inputId(｝/>