入力テキストから数値を取得し、ボタンをクリックするとインクリメントします。ReactJS

Question

ボタンを作成しようとしましたが、入力テキスト値をインクリメントしました。

ボタンは値を増減します。 （value = '+' OR '-'）
このinput textの値を取得し、値を使用するときに我々だけ取得し、+1

が、私はこの使用reactjsの完全な例をしてください必要が何をするに

を（下図を参照）。

Answer 1

あなたが唯一のどのボタンに基づいて状態を更新する必要があるボタンをクリックしたとき

をクリックされたあなたはcontrolled vs uncontrolled Inputsにこの答えを読むことができ、あなたの入力要素が制御される1つであることを確認しますと、

サンプルスニペット

class App extends React.Component { 
 
state = { 
 
    count: 0 
 
} 
 
    
 
updateValue = (val) => { 
 
    this.setState(prevState => ({count: prevState.count + val})); 
 
} 
 
render() { 
 
    return <div> 
 
     <input type="number" value={this.state.count} /> 
 
     <input type="button" onClick={this.updateValue.bind(this, -1)} value="Decrement"/> 
 
     <input type="button" onClick={this.updateValue.bind(this, 1)} value="Increment"/> 
 
    </div> 
 
} 
 
} 
 

 
ReactDOM.render(<App/>, document.getElementById('app'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.0.2/react.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.0.2/react-dom.js"></script> 
 
<div id="app"/>