时间戳

首页 > 解决方案 > 状态未在 componentWillMount 中更新

reactjs - 状态未在 componentWillMount 中更新

问题描述

class ViewExchange extends React.Component{ 
  state={list:[],refresh:false}
  componentWillMount(props){

    if(_.isEmpty(Cookies.get())){
     this.props.history.push("/signup")
    }
    else{
      console.log("is present")
    let platform = Cookies.get('platform')
    console.log(platform)
    axios.post('http://localhost:3001/user/viewexchange',{platform})
    .then(res=>{
      console.log(res.data)
      this.setState({list:res.data})})
    
    console.log(this.state.list)
    }
  }


 render(){
      return (
        <div>
          <button onClick={()=>this.setState({refresh:true})}>refresh</button>
          {console.log(this.state.refresh)}
        </div>
    );
      }
}
export default withRouter(ViewExchange);

标签： reactjs

解决方案

setState状态更新操作是异步的，因此更新状态需要一些时间。但是您的日志在更新之前执行。相反，您可以使用传递函数作为 setState 中的第二个参数：

this.setState({list:res.data}, () => console.log(this.state.list))

另一种方法是：

this.setState(state => {
     state.list = res.data
}, () => console.log(this.state.list))

推荐阅读