엄지월드

[React] Warning: Each child in a list should have a unique "key" prop. 본문

Front/React

[React] Warning: Each child in a list should have a unique "key" prop.

킨글 2024. 5. 23. 11:25

Warning: Each child in a list should have a unique "key" prop. 에러가 나는 경우 

index 값은 마땅히 없을 때에 순수 javascript로 uuid를 만들어서 추가할 수 있다. 

 

...

return (<th key={generateUUID()} scope='col'>{item.coNm}</th>)

function generateUUID() {
    // UUID v4 생성
    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        const r = Math.random() * 16 | 0, v = c === 'x' ? r : (r & 0x3 | 0x8);
        return v.toString(16);
    });
}

 

Comments