setTimeout的.只能更新已安装或安装的组件

Question

我是新的反应,我试图在1秒后改变状态

export class Header extends Component {

 constructor() {
  super()
  this.state = {name: 'Will'}
 }

 render() {

  setTimeout(() => {
   this.setState({ name: 'Bob' })
  }, 2000);

  return (
    <h1>
     {this.state.name}
   </h1>
  )
 }
}

但是给了我这个警告

警告:只能更新已安装或安装的组件.这通常意味着您在已卸载的组件上调用了setState,replaceState或forceUpdate.这是一个无操作.请检查Header组件的代码.

Answer 1

首先,您的render功能不应该有任何副作用(例如启动计时器).移动该代码componentDidMount.此外,清除超时componentWillUnmount以确保在删除组件后超时不会启动.这应该摆脱你得到的错误.