动态创建 TextField reactjs。值不更新

Question

我需要根据从 ajax 调用中获得的数组动态创建文本字段（材质 ui reactjs）。

下面是代码：

handleChange = (event, something) => {
            var rNum = event.target.id;
            this.setState(prevState => ({
                // R2_1:"adsf",
                testing: "cccc"
                // [rNum]: event.target.value,
            }));
        };
         componentDidMount() {
                 this.props.question.responses.map((response) => {
                    var responseElem = <TextField id='testing' label="Please enter text"
                        value={this.state.testing}
                        onChange={(event) => { this.handleChange(event) }}
                    />;
                    this.setState(prevState => ({
                        responseElems: [...prevState.responses, responseElem]
                    }));
                });
            }
         render() {
            return (
                <div className="TextBoxType">
                    <p dangerouslySetInnerHTML={{ __html: this.props.question.text }} />
                    {this.state.responseElems}
                </div>
            );
        }

当我更改文本字段的值时，它会触发 handlechange 事件并更新状态值。然而，尽管它已经绑定到 state.testing，但它并没有改变 textField 中的实际值。有人可以建议吗？谢谢。

Answer 1

查看original documentation。它没有描述处理数组，但我相信它会在您的情况下稍作修改。

正如我所见，您的 onChange 事件可能对代码进行了更多优化（也可以使用 doc 实现）