reactjs - 从字段数组中，您可以保存输入的值吗？

Question

我正在尝试从 inpit 获取值并存储它。我创建了一个数组，在其中放置了选定数量的“输入”，然后遍历数组并输出数据。任务是将输入的值放入所有“输入”并保存它们。尝试使用“e.target”，解决方案没有帮助。告诉我如何实现它？

class Rules extends Component {
    constructor(props) {
        super(props);
        this.state = {
            
            newNameColumns: [],
           
        }
    };
    
    handleChange(value) {
        let newInputColumns = []
        for (let i = 0; i < value; i++) {
            newInputColumns.push({
                key: this.setState({count: this.state.count + 1}),
                input: <Input />
            });

        }
        this.setState({newNameColumns: [...this.state.newNameColumns, ...newInputColumns]});
    }

    render() {
     
        const {newNameColumns} = this.state;

        const dataTableRules =
            <div className="modal-create-table">
                <Input placeholder="enter title rule"/>
                <Select defaultValue="0" style={{width: 220}} onChange={this.handleChange.bind(this)}>
                    <Option value="1">1</Option>
                    <Option value="2">2</Option>
                    <Option value="3">3</Option>
                    <Option value="4">4</Option>
                </Select>
            </div>;

        return (
            <div className="rules">
                
                <TableRules/>
                <Modal
                   
                    newNameColumns={newNameColumns}
                 
                />
            </div>
        )
    }
}

{props.newNameColumns.map(item => (
                        <div className="new-input-columns-name" key={item.key}>{item.input}</div>
                ))}

Answer 1

尝试event.target.value在更改处理程序中使用。

handleChange(event) {
   ...

   this.setState({tableAmountColumns: event.target.value});

   ...
}