Обновляйте массив иммутабельно и используйте устойчивый ID задачи. Мутация текущего state и индекс как идентификатор приводят к пропущенным обновлениям и путанице строк.
Как исправить добавление и удаление задач в React
Обновляйте массив иммутабельно и используйте устойчивый ID задачи. Мутация текущего state и индекс как идентификатор приводят к пропущенным обновлениям и путанице строк.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
В todo-компоненте задача добавляется через tasks.push(item), список использует key=index, удаление — splice. Почему это хрупко и как исправить?
Ответ
Обновляйте массив иммутабельно и используйте устойчивый ID задачи. Мутация текущего state и индекс как идентификатор приводят к пропущенным обновлениям и путанице строк.
Добавление: setTasks(previous => [...previous, item]); удаление: setTasks(previous => previous.filter(task => task.id !== id)). ID создавайте при добавлении, а не при render. Обрежьте пробелы и отклоните пустую задачу. Кнопки внутри формы должны иметь явный type, а поле — доступную подпись.