2017-04-15 141 views
3

嘗試React無線電,但奇怪的是,無線電選擇不會更新其視圖。任何人都可以看看下面的代碼,讓我知道什麼是錯的?React單選按鈕不更新選擇

class Test extends React.Component { 
    constructor(props){ 
    super(props); 

    this.state = { 
     radioVal: "first" 
    } 
    } 

    handleRadioSelection(e){ 
    e.preventDefault(); 

    this.setState({ 
     radioVal:e.target.value 
    }) 
    } 

    render(){ 
     return (
     <div> 
      <label> 
      <input type="radio" onChange={this.handleRadioSelection.bind(this)} 
      checked={ this.state.radioVal==="first"} 
      value="first" 
      name="radio1" /> 1 <br /> 
      </label> 

      <label> 
      <input type="radio" onChange={this.handleRadioSelection.bind(this)} 
      checked={this.state.radioVal==="second"} 
      value="second" 
      name="radio1" /> 2 <br /> 
      </label> 
      { "Selected: " } {this.state.radioVal} 
     </div> 
    ) 
    } 
} 

React.render(<Test />, document.getElementById('container')); 

回答

1

handleRadioSelection刪除e.preventDefault();。首先添加該行是否有原因?

+1

哎呀!是的,從jQuery習慣錯誤。 –