[Ant.Design] Table 생성 시 에러

제법 예전의 이슈지만 정리한다.

antd table 을 생성할 때, map 을 사용하지 않았고, 반복도 하지 않았으나 key 값을 지정하라는 에러가 나타났다.

보통 map 으로 고유키를 지정하지 않고 반복을 돌렸을 때 늘 같은 에러가 떴기 때문에 key 값을 어디에 지정을 하지 않았는지 찾느라 시간을 썼다.

column 에도 key 값을 지정해놓은 예제가 있어 지정했지만 오류는 해결되지 않았다.

찾아보니 column 뿐만 아니라, row 에도 key 값을 지정해줘야 에러가 사라진다고 한다.

Table props 에 rowKey 항목을 추가하고 고유키로 지정하니 해결됐다.

index.js:1451 Warning: Each child in a list should have a unique "key" prop.

Check the render method of `Body`. See https://fb.me/react-warning-keys for more information.
    in BodyRow (created by Body)
    in Body (created by Table)
    in table (created by Table)
    in div (created by Table)
    in div (created by Table)
    in Unknown
    in Unknown (created by Table)
    in div (created by Table)
    in Table (created by Table)
    in div (created by Context.Consumer)
    in div (created by Context.Consumer)
    in Spin (created by Table)
    in div (created by Table)
    in Table (at AlertList.js:194)
    in AlertList (at newAlerts/index.js:110)
    ...

import { Table } from 'antd';
...
return (
  <Table
    className="alertsTable"
    rowClassName="alertsTable-row"
    rowKey={(row) => row.alarm_id} // << row 고유키 지정
    ...
  />
)