Удаление из массива
В расписании нужно уметь и убирать группу. И снова не меняйте массив из состояния: создайте новый, без этого элемента. Именно это делает filter(). Он создаёт новый массив из тех элементов, для которых его функция вернула true:
function handleRemove(id) {
setSchedule((schedule) => schedule.filter((bandId) => bandId !== id));
}Остаётся каждый идентификатор, не равный id, так что в новом массиве есть всё, кроме убранной группы. Методы, которые меняют массив на месте, например pop() или sort(), так же не подходят для состояния, как и push(). Spread, filter() и map() создают новые массивы, поэтому пользуйтесь ими. (Когда нужен отсортированный список, сортируйте копию: [...bands].sort(…).)
После удаления группы нет в schedule, и при следующей отрисовке меняется всё, что от него зависит: в myBands её больше нет, а условие из прошлого упражнения снова показывает её кнопку «Добавить». Состояние одно, и страница следует за ним везде.
Когда расписание пусто, заголовок «Моё расписание» стоит над пустым местом. Это задача для условия из урока «Списки и условия»: с помощью ? : покажите либо абзац с сообщением, либо список, в зависимости от schedule.length.
Задание
- 1
Добавьте каждой группе в разделе «Моё расписание» кнопку «Удалить», которая убирает её идентификатор из
scheduleс помощьюfilter(). После этого у группы снова появляется кнопка «Добавить». - 2
Когда расписание пусто, покажите вместо списка абзац
В расписании пока ничего нет.