【React】これ。Warning 「 Each child in an array or iterator should have a unique “key” prop. Check the render method of `ComponentName`」が出たら

【React】これ。Warning 「 Each child in an array or iterator should have a unique "key" prop. Check the render method of `ComponentName`」が出たら

たまにmap処理を使っているとWarning出ているときあります。
下記の様に
【React】Warning 「 Each child in an array or iterator should have a unique "key" prop. Check the render method of `ComponentName`」が出ます。
ComponentNameの所は具体的に直すべきComponentです。

key属性に一意の値を渡して終わりです。
なぜかはこちら
https://facebook.github.io/react/docs/lists-and-keys.html

listで返されるDOMはそれぞれidを持つことで不要なレンダリングを避けたりできるようです。
なので「ユニークなidをkeyに渡すことでそれを実現するべき」だと認識しています。

【 併せて読みたい 】

【REACT】REACTの動きを理解したい人の為の最小サンプル

【REACT入門】過去のREACT初心者の自分にREACTのPROPSとSTATEの違いを簡単に説明してあげたい

【REACT × ES6 × FLUX】を手っ取り早く学びたい人の為にサンプル作ったよ【3の倍数と3が付くときだけ猫になるCOUNTER】

REACT × FLUX × ES6 [WIP]LINE風チャット

他のReact記事

フロントエンド記事

github

qiita