react -- 計時器

標籤：

var SetIntervalMixin = {
componentWillMount: function(){
this.intervals = [];
},
setInterval: function(){
this.intervals.push(setInterval.apply(null, arguments));
},
componentWillUnmount: function(){
this.intervals.forEach(clearInterval);
}
};

var TickTock = React.createClass({
mixins: [SetIntervalMixin],
getInitialState: function(){
return { seconds: 0 }
},
componentDidMount: function(){
this.setInterval(this.tick, 1000);
},
tick: function(){
this.setState({ seconds: this.state.seconds + 1 });
},
render: function(){
return (
<p>React has been running for {this.state.seconds} seconds.</p>
);
}
});

ReactDOM.render(
<TickTock />,
document.querySelector(‘.demo‘)
);

react -- 計時器