こんにちは。
野中やすおです。
以前の記事で、React.jsを扱っているとしばしば遭遇する「warning: Each child in a list should have a unique “key” prop.」の対処方法について書きました。
関連記事
こんにちは。 野中やすおです。 今回の記事では、React.jsを扱っているとしばしば遭遇する「warning: Each child in a list should have a unique "key" prop.」という[…]
今回の記事では、特に私が愛用するAnt DesignのTable使用時に上記のエラーがというエラーが出ている時の対処方法について書きたいと思います。
目次
解決策
といっても対処方法は簡単で、Ant DesignのTableメソッドには「rowKeyプロパティ」という行を一意に設定するキーがあります。そのため、以下のような実装になります。
1 |
return <Table dataSource={games} columns={columns} rowKey="game_id" /> |
このようにrowKeyの中でgame_idというキーを設定してあげることで、warningがなくなります。
また個人的に、ReactのUIフレームワークとしてAnt Designをとても気に入っています!ぜひ皆さんも使ってみてください!