File tree Expand file tree Collapse file tree 3 files changed +3
-20
lines changed
advanced-hooks/05-form-actions/lecture Expand file tree Collapse file tree 3 files changed +3
-20
lines changed Original file line number Diff line number Diff line change @@ -41,21 +41,6 @@ export function App() {
41
41
const [ messages , setMessages ] = useState < Message [ ] > ( [ ] )
42
42
const [ pending , setPending ] = useState ( false )
43
43
44
- // // 1. Making this an async function makes little difference
45
- // // 2. However, setting messages state with the fn approach
46
- // // fixes the fact that messages were being overridden
47
- // async function handleSubmit(e: FormEvent<HTMLFormElement>) {
48
- // e.preventDefault()
49
- // setPending(true)
50
- // const formData = new FormData(e.currentTarget)
51
- // messageRef.current.value = ''
52
- // messageRef.current.focus()
53
- // const res = await addMessage(formData.get('messageText') as string)
54
- // const { message: newMessage } = await res.json()
55
- // setMessages((messages) => messages.concat(newMessage))
56
- // setPending(false)
57
- // }
58
-
59
44
function handleSubmit ( e : FormEvent < HTMLFormElement > ) {
60
45
e . preventDefault ( )
61
46
setPending ( true )
Original file line number Diff line number Diff line change @@ -3,9 +3,6 @@ import * as ReactDOM from 'react-dom/client'
3
3
import { LessonBody , LessonCard } from '~/Lesson'
4
4
import { Counter } from './Counter'
5
5
6
- // A nice visual explanation of keys
7
- // https://twitter.com/dan_abramov/status/1415279090446204929
8
-
9
6
function App ( ) {
10
7
const vacations = [
11
8
{ id : 1 , name : 'Maui' , hotels : 5 } ,
@@ -15,8 +12,7 @@ function App() {
15
12
{ id : 5 , name : 'Florida Keys' , hotels : 1 } ,
16
13
]
17
14
18
- // Do "reduce" for total hotels
19
- const totalHotels = 16
15
+ const totalHotels = vacations . reduce ( ( sum , item ) => sum + item . hotels , 0 )
20
16
21
17
return (
22
18
< LessonBody >
Original file line number Diff line number Diff line change @@ -11,6 +11,8 @@ export function App() {
11
11
useState ( /* initialState */ )
12
12
13
13
function loadVacations ( ) {
14
+ // The getAll() method will resolve an array of vacations. We nest our network API calls
15
+ // in objects like api.vacations.getAll() for convenience.
14
16
api . vacations . getAll ( ) . then ( ( vacations ) => {
15
17
console . log ( vacations )
16
18
} )
You can’t perform that action at this time.
0 commit comments