易百教程

20、如何更新组件的状态?

可以使用 this.setState() 方法更新组件的状态。此方法并不总是立即替换 State。它只添加对原始状态的更改。它是用于更新用户界面(UI)以响应事件处理程序和服务器响应的主要方法。

例子

import React, { Component } from 'react';  
import PropTypes from 'prop-types';  

class App extends React.Component {  
   constructor() {  
      super();        
      this.state = {  
          msg: "Welcome to JavaTpoint"  
      };      
      this.updateSetState = this.updateSetState.bind(this);  
   }  
   updateSetState() {  
       this.setState({  
          msg:"Its a best ReactJS tutorial"  
       });  
   }  
   render() {  
      return (  
         <div>  
             <h1>{this.state.msg}</h1>  
             <button onClick = {this.updateSetState}>SET STATE</button>  
         </div>  
      );  
   }  
}  
export default App;