View Code? Open in Web Editor
NEW
This project forked from mate-academy/react_goods-selector
JavaScript 70.30%
HTML 27.70%
SCSS 2.00%
react_goods-selector's Introduction
- You are given an array of goods
- Display them as a list inside the
App (DON'T create additional components)
- Add
h1 initially saying No goods selected
- Save a
selectedGood in the App. Let it be Jam by default
- The
h1 should always show the name of the selected good Jam is selected
- The selected good should be hightlighted in the list (add CSS class with a background)
- Add a button
Select next to each good in the list
- When you press the button the good becomes selected
- Don't show the button next to the selected good
- You can select another good by pressing its
Select button
- Add button
X for to the h1 to clear the selection. (Set null)
- The clear button should not be visible if there is no selected good
(* Optional) Advanced task
- Implement the ability to select multiple goods (use
selectedGoods Array)
- Use functional
setState described in this video
- Show
Add or Remove instead of Select button
- All the selected goods should be listed in the
h1:
No goods selectedJam is selectedCarrot, Jam and Eggs are selected
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent