React の List 表示のために緩くユニークなIDを作成する

created 2021/12/24updated 2021/12/24

React で list 表示をする際には、keyを設定し、その値で rendering の挙動を変えています。

useState で配列が頻繁に変更される場合に、index を使用する場合 rendeing の挙動がおかしくなります。そのため各要素に緩いユニークを付与します。

ts
const createId = (): string => { const tmpId: string = new Date().getTime().toString(16) return `list-${tmpId}` } createId()

リストと key – React