Reactでユニークなkey指定の警告が出たときの対処法

@iwasaki 139views 更新:2017年2月27日
Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `XXXList`. See https://fb.me/react-warning-keys for more information.

のような警告が出る場合があります。

for文で回す時にはユニークなkeyを指定しておくといいようです。

    Object.keys(this.props.data).forEach((key, index) => {
      list.push(
        <Checkbox
          key={this.props.data[key].id}
          id={this.props.data[key].id}
          label={this.props.data[key].label}
        />,
      );
    });

参考

http://h3poteto.hatenablog.com/entry/2016/01/03/013921

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません