React - 条件付きで入力値を設定する

Question

2つの入力タイプの数値フィールドがあり、最初の値（num1）に基づいて条件付きで2番目のフィールド値（num2）を設定しようとしています。

<input ref="num1" type="number" min="1" max="7" defaultValue={6}/> 

<input ref="num2" type="number" min="0" max={this.refs.num1 === 7 ? 0 : 10} defaultValue={10}/> 

num1の値が7に等しい場合、私はnum1のデフォルト値は6であり、Iは7にステップアップするとき、私が見ることができる全く異なるがない値0を設定するには、上記三オペレータが試してみましたnum2。

これを解決してください。

Answer 1

入力でonChangeイベントを使用して

<input onChange={this.onChange} /> 

を検証してみなどwomthingと方法onChangeを作成：私はあなたが欲しいものを理解すればわからないんだけど、あなた

onChange(e) { 
    let value = e.target.value; 
    return validation; 
} 

Answer 2

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

     this.state = { 
     num1: null 
     } 
    } 

    onChange(num, e){  
     this.setState({num1: e.target.value}); 
    } 

    render(){ 
     return(
      <div> 
       <input type="number" min="1" max="7" defaultValue={6} value={this.state.num1} onChange={this.onChange.bind(this, "num1")}/> 
       <input type="number" min="0" max={10} value={this.state.num1 == 7 ? 10 : 0} /> 
      </div> 
     ); 
    } 
} 

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

コンポーネントに状態を追加してくださいonChange関数を介して最初の入力の値を変更します。

次に、その値に応じて、2番目の入力の値を表示します。

ここにはfiddleがあります。