获取输入值并更新React js中的HTML元素

Question

我需要使用id功能项更新范围，使用ref =“editInp”从输入框中获取的值，单击span元素位于其附近。我在这里提到的代码可以在contentItem类中找到。

请回答我的问题。这对我有很大的帮助。

<pre>
var App = React.createClass({ 
    getInitialState : function() {
        return {content: []};
        return { showMe : false };
    },
    onClick : function() {
       this.setState({ showMe : true} );
    },
    addContent: function() {        
        var feature = React.findDOMNode(this.refs.myInput).value;
        var newItem = {className: "added_content", text: feature},
        content = this.state.content,
        newContent = React.addons.update(content, {$push: [newItem]});
        this.setState({content: newContent, showMe: false});
      },
    removeItem: function(item) {
        var content = this.state.content,
        index = content.indexOf(item);
        if (index > -1) {
          var newContent = React.addons.update(content, {$splice: [[index, 1]]});
          this.setState({content: newContent});
        }
      },
    render : function() {
     var value = this.state.value;
        if(this.state.showMe) { 
            return (
        <div>
            <ContentItem content={content} removeItem={this.removeItem} />
            <input ref="myInput" value={value} type="text" /> 
            <span onClick={this.addContent}>Save</span>
        </div>

       );
        } else {        

                return (
            <div>
                {this.state.content.map(function(content) {
                  return <ContentItem content={content}  removeItem={this.removeItem} />;
                }.bind(this))}
                <a ref="feature" onClick={this.onClick}> press me </a>
            </div>

        );

        } 
    }


});

var ContentItem = React.createClass({
  getInitialState : function() {
        return { content: [], showElement : false  };
    },
  propTypes: {
    content: React.PropTypes.object.isRequired,
    removeItem: React.PropTypes.func.isRequired
  },

  hideElement: function(){
    this.setState({ showElement : true} );
  },
  saveData: function(){
    var fea = React.findDOMNode(this.refs.editInp).value;
    var props = {};
    props.content.text = fea;
    this.setState({ showElement : false});
  },
  render: function() {
    if(this.state.showElement){
        return(<div ><input ref="editInp" type="text" /><span onClick={this.saveData}>save</span></div>);
    }
    else{
      return (<div className={this.props.content.className} onClick={this.hideElement}>
        <span id="featureItem">{this.props.content.text}</span>
        <span onClick={this.onRemove}>X</span>
        </div>);
    }
  },

  onRemove: function() {
    this.props.removeItem(this.props.content);
  }
});



React.render(<App />, document.body);
</pre>