美文网首页
State & 生命周期

State & 生命周期

作者: ShinPlus | 来源:发表于2019-07-23 09:54 被阅读0次
class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {date: new Date()};
  }

  componentDidMount() {
    this.timerID = setInterval(
      () => this.tick(),
      1000
    );
  }

  componentWillUnmount() {
    clearInterval(this.timerID);
  }

  tick() {
    this.setState({
      date: new Date()
    });
  }

  render() {
    return (
      <div>
        <h1>Hello, Rails!</h1>
        <h2>It is {this.state.date.toLocaleTimeString()}.</h2>
      </div>
    );
  }
}


ReactDOM.render(
  <Clock />,
  document.getElementById('root')
);

相关文章

  • react随记4 State&生命周期

    State&生命周期 React中组件生命周期如下图: 从上图中也可以看出,组件在构造函数中有state,也就是状...

  • Flutter中State的生命周期

    Flutter中State的生命周期 Flutter中State类(状态)一般与StatefulWidget配合使...

  • 翻译练习 react-组件和props

    状态和生命周期State and Lifecycle This page introduces the conce...

  • State & 生命周期

  • W5L2

    关于羽绒服产品生命周期的分析 The current state of the available technol...

  • React 组件渲染过程---自用

    组件的生命周期 getDefaultProps : 初始化propsconstructor:可以初始化state ...

  • Flutter第一天

    Flutter官方文档 Flutter - State类 flutter中的生命周期 Flutter-learni...

  • Flutter - State类

    写了这么多,无非就是State文档贴过来,最有感触的就两点: State 的生命周期和 StatefulWidge...

  • Flutter - State类

    写了这么多,无非就是State文档贴过来,最有感触的就两点: State 的生命周期和 StatefulWidge...

  • Taro生命周期

    Taro生命周期详解 主要介绍Taro中的9个生命周期钩子 生命周期与State 1.状态更新一定是异步的 2.同...

网友评论

      本文标题:State & 生命周期

      本文链接:https://www.haomeiwen.com/subject/wbgnlctx.html