mirror of
https://github.com/microsoft/frontend-bootcamp.git
synced 2026-01-26 14:56:42 +08:00
22 lines
986 B
Markdown
22 lines
986 B
Markdown
# Step 2.6: Redux: React Binding (Exercise)
|
|
|
|
[Lessons](../) | [Exercise](./exercise/) | [Demo](./demo/)
|
|
|
|
If you haven't arStart the app by running `npm start` from the root of the `frontend-bootcamp` folder. Click the "exercise" link under day 2 step 6 to see results.
|
|
|
|
At the beginning of this exercise, the "Add" and "Clear Completed" buttons do not work. We'll be fixing that in this step!
|
|
|
|
1. Open `exercise/src/index.tsx` and wrap `<TodoApp>` with `<Provider>` as instructed in the comment
|
|
|
|
2. Open `exercise/src/components/TodoFooter.tsx` and erase the "nullable" type modifier (i.e. the ?) in the interface definition of `TodoFooterProps`
|
|
|
|
3. Uncomment the bottom bits of code and fill in `connect()` arguments - feel free to use `TodoListItem.tsx` as a guide
|
|
|
|
4. Repeat steps 2, 3 for the `TodoHeader.tsx` file
|
|
|
|
## Bonus exercise
|
|
|
|
For further reading, go here to learn more about the `mergeProps` and `options` parameters to `connect()`:
|
|
|
|
https://react-redux.js.org/api/connect
|