单击按钮时,渲染新文本字段。通过单击警报来显示每个文本字段的值?我只接受最后创建的,即使创建一个数组总是被新的
覆盖var CreateElementForm = React.createClass({
getInitialState(){
return {
fieldsCount : 1
}
},
addField: function(e){
e.preventDefault();
this.setState({ fieldsCount: this.state.fieldsCount + 1 });
},
onAlertInput: function(e){
this.setState({
myValue: e.target.value
})
},
showAllert: function(e){
e.preventDefault();
alert(this.state.myValue);
},
render : function() {
var fields = [];
for (let i = 0; i < this.state.fieldsCount; i++) {
fields.push(<input onChange={this.onAlertInput} key={i} ref={'text__input_'+(i)} />);
}
return(
<form>
{fields}
<button className='lolo + {fieldsCount}' onClick={this.addField}>+</button>
<button onClick={this.showAllert}>alert</button>
<span>{fields.length}</span>
</form>
)
},
});
ReactDOM.render(
<CreateElementForm />,
document.getElementById('apps')
);