[react 16 breaking changes]refsコールバック実行タイミング

refsのコールバック実行タイミング

下記のreact 16の変更点に示された通り、refsコールバック関数の呼び出されるタイミングが、VirtualDom更新時ではなく、物理DOMに反映された時になります。

Shallow renderer no longer calls componentDidUpdate because DOM refs are not available.
This also makes it consistent with componentDidMount (which does not get called in previous versions either).

そのため、componentDidMountメソッドではrefコールバックで保存されたthis.refDomがnullになりますので、元々componentDidMountめそっどで行われたthis.refDomを使った処理をrefコールバックに移行しなければなりません。

<div
  ref={(input) => {
    this.refInput = input;
    // ここでやる
    ...
  }}
  >
  ...
</div>

参考情報

React v16.0

Refs and the DOM