search

tel-ran-de / FE-24-m

2 stars 0 forks source link

FE 2022-06-13 React Basic Practice #32

Open Nolra opened 2 years ago

Nolra commented 2 years ago

Код занятия (Todos): https://github.com/tel-ran-de/FE-24-m/tree/fe-06-13-react-basic-practice Пример: https://todomvc.com/examples/react/#/

Домашнее задание

  1. Сделать отдельный компонент StatusList и импортировать его в Todos, показывать компонент, если в todoList есть элементы массива (если он не пустой).

  2. Сделать элемент, внутри StatusList. Элемент будет отображать количество активных (completed: false) items в todoList "2 items left"

  3. Сделать кнопку clear completed , внутри StatusList. Кнопка должна по клику вызывать функцию, которая будет удалять из todoList все completed: true элементы массива и обновлять state todoList (по аналогии с тем, как мы удаляем элемент по id при клике на deleteTodo, но вместо id будeт todo.completed)

  4. Дополнительно - придумать как мы должны реализовать tabs в StatusList (all, active, completed), попробовать описать эту логику своими словами в комментариях в Todos. Обсудим потом на занятии способы реализации.

mwalexandra commented 2 years ago

https://github.com/mwalexandra/TelRan/tree/main/FE/22.06.11_react_todos/todos

eduard-lab-front-end commented 2 years ago

https://github.com/Eduard-basic24-25/react-todos-class-