ReactJS在表单中引用相同的组件

我正在ReactJS上构建多项选择题测验应用程序。 用户应该做的第一件事是用问题和答案填写表单并提交（就像在谷歌表单上一样）

{questions.map（（问题，i）=>(
this.questionComp=q}
数字={i}
选择={question.choices}/>
))}
提交

在

组件中，我有输入字段。

---

在提交后，如何获取每个问题组件中的输入值？

在问题组件中，可以添加返回所需值的函数

例如：

class Question extends React.Component {
    getInputValue() {
        return this.textInput.value;
    }
    render() {
        return ( <input ref={(input) => { this.textInput = input; }} );
    }
}

类问题扩展了React.Component{
getInputValue（）{
返回this.textInput.value；
}
render（）{
返回（{this.textInput=input；}}}）；
}
}

---

然后从handleSubmit函数中的问题组件调用getInputValue函数。

我解决了将它们存储到数组中的问题

{questions.map((question, i) => (
        <Question key={i}
                  ref={q => this.questionsArray[i] = q}
                  number={i}
                  choices={question.choices}
                  clickAddQuestion={this.addQuestion} />
      ))}

{questions.map（（问题，i）=>(
this.questionsArray[i]=q}
数字={i}
选择={question.choices}
单击addQuestion={this.addQuestion}/>
))}

它仅适用于on组件。我有多个问题组件。我如何从它们中获取值？

{questions.map((question, i) => (
        <Question key={i}
                  ref={q => this.questionsArray[i] = q}
                  number={i}
                  choices={question.choices}
                  clickAddQuestion={this.addQuestion} />
      ))}