获取动态输入中的值

时间:2016-06-24 18:41:44

标签: reactjs

单击按钮时,渲染新文本字段。通过单击警报来显示每个文本字段的值?我只接受最后创建的,即使创建一个数组总是被新的

覆盖
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')
);

0 个答案:

没有答案