ReactJS：從沒有onChange事件的道具中選擇默認值？

所以，我只是想知道如果我絕對需要在React中的select組件上有一個onChange事件處理程序？ReactJS：從沒有onChange事件的道具中選擇默認值？

我有一個道具傳入我想要選擇的選項的默認值。它的工作原理沒有問題，如果我有：

<select 
    value={this.props.defaultValue} 
> 
    <option value="a">A</option> 
    <option value="b">B</option> 
</select>

除此之外，它是靜態的，因爲我相信你所熟悉的錯誤：

Warning: Failed form propType: You provided a `value` prop to a form field without an `onChange` handler. 
This will render a read-only field.

正如我正在使用jQuery的價值，我不噸需要一個國家或任何父母和子女之間...

是否有一個簡單的方法來允許選擇從道具獲取默認值，仍然作爲一個正常的選擇操作改變一個選項更改值我可以抓住jquery，還是我必須有一個狀態，並onChange處理程序？

謝謝！

我已經嘗試過：

<select 
    defaultValue={this.props.defaultValue} // just returns the first option 
> 
    <options etc.> 
</select>

另外，我寧可不要等反應，選擇...我只是想有一個默認值和正常選擇使用外部包...

來源

2017-05-03 Daltron

什麼反應您使用的版本？ –

你在做什麼是有效的，也許更新你的反應版本，檢查了這一點：https://jsfiddle.net/y64gbhf8/ –

由於@julien提到，您可以使用參考，而不是jQuery來獲得不受控制組件選擇的當前值：

class MySelect extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { currentValue: this.props.defaultValue }; 
    } 

    updateValue() { 
    this.setState({ currentValue: this.refs.myselect.value }); 
    } 

    render() { 
    return (
     <div> 
     <div> 
      <button className="current" onClick={this.updateValue.bind(this)}>{this.state.currentValue}</button> 
     </div> 

     <select ref="myselect" defaultValue={this.props.defaultValue}> 
      <option value="a">A</option> 
      <option value="b">B</option> 
      <option value="c">C</option> 
     </select> 
     </div> 
    ); 
    } 
}

對於其他部分，defaultValue應該工作就像你試圖。

檢查這個例子小提琴：https://jsfiddle.net/y64gbhf8/1/

來源

2017-05-03 02:42:55

你可以嘗試Uncontrolled Components

你不需要寫狀態更新，DOM將處理它，那麼你可以使用一個裁判從DOM

獲取表單值的事件處理程序3210

來源

2017-05-03 02:03:59 Julien

ReactJS：從沒有onChange事件的道具中選擇默認值？

回答

相關問題