は、私が現在働いていない、単純な更新データ機能を持っているにupdateState機能

Question

に反応：

class App extends React.Component { 

      constructor(props) { 
       super(props); 

       this.state = { 
       data: 'Initial data...' 
       } 

       this.updateState = this.updateState.bind(this); 

      }; 

      updateState() { 
       this.setState({data: 'Data updated...'}) 
      } 

      render() { 
       return (
       <div> 
        <button onClick = {this.updateState}>CLICK</button> 
        <h4>{this.data}</h4> 
       </div> 
      ); 
      } 
     } 

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

私はjsbinするためのリンク持た下：

http://jsbin.com/vidumiroki/edit?html,js,output

Answer 1

をあなたはあなたの状態を逃した機能

をレンダリング返します

class App extends React.Component { 

    constructor(props) { 
     super(props); 

     this.state = { 
     data: 'Initial data...' 
     } 

     this.updateState = this.updateState.bind(this); 

    }; 

    updateState() { 
     this.setState({data: 'Data updated...'}) 
    } 

    render() { 
     return (
     <div> 
      <button onClick = {this.updateState}>CLICK</button> 
      <h4>{this.state.data}</h4> 
     </div> 
    ); 
    } 
} 

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