SOURCE

class MyInput extends React.Component{
  constructor(props){
    super(props)
  }
  
  change = (e) =>{
    this.props.onChange({value:e.target.value,type:this.props.type})
  }
  
  render(){
    return (<input value={this.props.value} style={{width:'100px'}} onChange={this.change}/>)
  }
}

class MyCount extends React.Component{
  constructor(props){
    super(props)
    this.state = {value:0,type:'first'}
  }
  
  change = (o) =>{
    this.setState(o)
  }
  
  render(){
    let value = this.state.value
    let firstValue = this.state.type=='first'?value:100-value
    let secondValue = this.state.type!=='first'?value:100-value
    return (
      <div>
      <MyInput type="first" value={firstValue} onChange={this.change}/> 
      + 
      <MyInput type="two" value={secondValue} onChange={this.change}/> 
      = 100
      </div>
    )
  }
}

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

<script src="https://unpkg.com/react/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.development.js"></script>
<div id="app"></div>