The life cycle of react components

Componentwillmount: Before the component appears, the DOM has not been rendered into the HTML document;

Componentdidmount: The completion of the piece rendering has already appeared in the DOM document;

Componentwillunmount: said the event will be triggered when the component is about to be removed from the DOM;

React Life Cycle Demo

First introduce the relevant JS

<script type= "Text/javascript" src= "React.js" ></script>
<script type= "Text/javascript" src= "Jsxtransformer.js" ></script>

<script type= "TEXT/JSX" >varTimer=React.createclass ({getinitialstate:function(){                return{secondselapsed:0}}, tick:function(){                 This. SetState ({secondselapsed: This. state.secondselapsed+1}); }, Componentdidmount:function(){                 This. Interval=setinterval ( This. tick,1000); }, Componentwillunmount:function() {clearinterval ( This. Interval); }, Render:function(){                return(<div>timer:{ This.state.secondselapsed}</div>)            }        }); React.render (<timer/>,document.body) </script>

The life cycle of react components