如何使用ReactJS从单选按钮和输入框中获取值？

Question

我做了一个有问题的表格。 other单选按钮有4个单选按钮选项和1个输入框。如果选中其他单选按钮，如何从输入框中获取值。

class ContactForm extends Component {

  setGender(event){
    console.log(event.target.value);
  }

render(){

<form>
<div id="gender" onChange={this.setGender.bind(this)}>
              <div className="form-group">
                <div className="col-sm-offset-2 col-sm-10">
                  <h4>What is your gender?</h4>  
                </div>
              </div>

              <div className="form-group">
                <div className="col-sm-offset-2 col-sm-10">
                  <div className="radio">
                    <label><input type="radio" name="gender"/> Female</label>
                  </div>
                </div>
              </div>
              <div className="form-group">
                <div className="col-sm-offset-2 col-sm-10">
                  <div className="radio">
                    <label><input type="radio" name="gender"/> Male</label>
                  </div>
                </div>
              </div>
              <div className="form-group">
                <div className="col-sm-offset-2 col-sm-10">
                  <div className="radio">
                    <label><input type="radio" name="gender"/> Prefer not to say</label>
                  </div>
                </div>
              </div>

              <div className="form-group">
                <div className="col-sm-offset-2 col-sm-10">
                  <div className="radio">
                    <label><input type="radio" name="gender"/>Other</label>
                    <input type="text" class="form-inline" id="other1"/>
                  </div>
                </div>
              </div>
            </div>
</form>
}

截图：

Answer 1

您可以对组件进行一些更改。

为它创建fiddle

添加了以下方法以使其工作。

setGender(checkedValue){
    console.log(checkedValue);
    if(checkedValue == '-1'){
     // get data from text box
    }
  }