#javascript #reactjs
#javascript #reactjs
Вопрос:
Я перебираю array
и внутри этого, я перебираю другое array
в операторе switch.
<TableBody>
{(rowsPerPage > 0
? filteredItems.slice(
page * rowsPerPage,
page * rowsPerPage rowsPerPage
)
: filteredItems
).map((row, index) => (
<TableRow key={index}>
{headers.map(({ value, idx }) => {
switch (value) {
case 'status':
return (
<TableCell key={idx}>
{row.status ? (
<Button
variant='contained'
className={classes.red}
onClick={() =>
changeStatus(row.id, row.status)
}
>
Deactivate
</Button>
) : (
<Button
variant='contained'
className={classes.green}
onClick={() =>
changeStatus(row.id, row.status)
}
>
Activate
</Button>
)}
</TableCell>
);
default:
if (value.split('.').length === 1) {
return (
<TableCell component='th' scope='row' key={idx}>
{row[value]}
</TableCell>
);
} else {
let obj = value.split('.')[0];
let nestObj = value.split('.')[1];
return (
<TableCell component='th' scope='row' key={idx}>
{row[obj] amp;amp; row[obj][nestObj]}
</TableCell>
);
}
}
})}
</TableRow>
))}
</TableBody>
В обоих местах я добавил свойство key. Почему я получаю эту ошибку?
Комментарии:
1. Может быть, он также жалуется
<Button>
на компоненты?2. Другое дело, что вы не должны использовать индекс массива в качестве ключа. Это плохая практика, потому что она нарушает идею наличия уникального ключа для идентификации изменений и повторного отображения только измененных элементов коллекции.