Reactのライフサイクル

Reactのライフサイクルに関して

var Life = React.createClass({

/* 描画前 ============================================================*/
    getDefalutProps(){
            /* 全体で一度しか呼ばれない */
            /* インスタンス作成時に親コンポーネントが値を指定しなかった時だけ、ここの値が使用される */
            /* 戻り値：Propsのキーと初期値(バリュー) */
    },
    getInitialState(){
            /* インスタンス作成毎に呼ばれる */
            /* 描画前にコンポーネントの状態を変更する最後のチャンス */
            /* 戻り値：Stateのキーと初期値(バリュー) */
    },
    componentWillMount(){
            /* 初回の描画時にのみ呼び出される */
            /* コンポーネントがページに追加される直前に呼び出される */
            /* 引数も戻り値もなし */
    },

/* 描画 ============================================================*/
    render: function(){
            /* 戻り値：ReactのElement */
    },

/* 描画後 ============================================================*/
    componentDidMount(){
        /* 初回の描画完了後に呼ばれる */
        /* ここではじめて実際のDOMの操作が出来る(React.findDOMNode(this)) */
    },


/* 再描画前 ============================================================*/
    componentWillReceiveProps(nextProps) {
        /* 引数 : 親から送られた値(props) */
        /* 親コンポーネントのstate等が変更されて、再描画が発生する際に呼ばれる */
        /* ただしこの時点ではthis.propsは変わっていない */
    },

    /* 再描画キャンセル */
    shouldComponentUpdate(nextProps, nextState) {
        /* falseを返すと、componentWillUpdateとcomponentDidUpdateとrenderをskipする */
        /* propsやstateが変わっても描画内容に変更がないとわかるときにパフォーマンスを早くするために使用 */
    },

    componentWillUpdate(nextProps, nextState){
        /* propsとstateの更新による再描画が行われる直前に呼び出される */
        /* stateやpropsは変更できない */
    },

/* 再描画後 ============================================================*/
    componentDidUpdate(prevProps, prevState){
        /* 再描画後に実際のDOMにアクセスするためのメソッド */
    },

/* コンポーネント破棄時 ============================================================*/
    componentWillUnmount() {
        /* コンポーネント削除時に呼び出される */
    },
});

各アクションで実行される順番

...正直ちょっと怪しい

メソッド名	初回描画時	インスタンス作成時	再描画時	破棄時
getDefalutProps	1
getInitialState	2	1
componentWillMount	3	2
render	4	3	4
componentDidMount	5	4
componentWillReceiveProps			1
shouldComponentUpdate			2
componentWillUpdate			3
componentDidUpdate			5
componentWillUnmount				1