react-base-tableに設定するデータはidが必要

テーブル形式のデータをReactで表示するときに、ソートや列の幅調整などもできるreact-base-tableライブラリを使うことにしました。

autodesk.github.io

サンプルを見ながら実装していたところ、セルに表示する文字列が長く3行以上になると何故かテーブルがチラつく（というか、レンダリングが無限ループしているような状態）になってしまいました。

rowKeyでデータを一意に特定するidの設定が必要

Get Startedのドキュメントを改めて確認したところ、unique Key の説明で、

unique key
key is required for column definition or the column will be ignored

Make sure each item in data is unique by a key, the default key is id, you can customize it via rowKey

と説明されており、デフォルト設定では "id" というプロパティをユニークキーにしていますよ、とハッキリ書いてありました。
確かにダミーデータにidは入れていなかった・・・。

なので、rowKeyは省略できるけれど、実際は

<BaseTable
  rowKey="id"
  :

ということなんですね。ユニークキーをidでは無いものにしたければ、ここの設定が変えれば良いと。

文字列の折返しをしてセルの高さを調整するとき、idが無いことで再レンダリングが止まらないのかなという予想で、改めてダミーデータにidを設定したら再レンダリングが無く、正しく動きました。

ドキュメントはしっかり読みましょう。