Храните один selectedId вместо отдельного флага у каждого элемента; цвет вычисляйте сравнением с этим id.
Добавь возможность выбора элемента: при нажатии он подсвечивается красным, но из всего списка можно выбрать только один элемент.
Храните один selectedId вместо отдельного флага у каждого элемента; цвет вычисляйте сравнением с этим id.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Храните один selectedId вместо отдельного флага у каждого элемента; цвет вычисляйте сравнением с этим id.
Пример React для элементов с уникальными id. Повторное нажатие сохраняет выбор; если нужен сброс, это отдельное правило.
import { useState } from 'react';
function SelectableList({ items }) {
const [selectedId, setSelectedId] = useState(null);
return <ul>{items.map(item => <li key={item.id}>
<button type="button" aria-pressed={selectedId === item.id}
className={selectedId === item.id ? 'selected' : ''}
onClick={() => setSelectedId(item.id)}>{item.label}</button>
</li>)}</ul>;
}
.selected { background: #b91c1c; color: white; }
Если выбранный элемент исчез из данных, можно дополнительно сбросить id по требованиям интерфейса.