Skip to content

Commit 8aad486

Browse files
committed
Clarify React DOM APIs in React 19 Post
1 parent 9aa8e82 commit 8aad486

File tree

1 file changed

+7
-7
lines changed

1 file changed

+7
-7
lines changed

src/content/blog/2024/04/25/react-19.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ Actions automatically manage submitting data for you:
115115

116116
</Note>
117117

118-
Building on top of Actions, we're also introducing [`<form>` Actions](#form-actions) to manage forms automatically, [`useOptimistic`](#new-hook-optimistic-updates) to manage optimistic updates, and new hooks [`useActionState`](#new-hook-useactionstate), [`useFormStatus`](#new-hook-useformstatus) to support the common cases for Actions and Forms.
118+
Building on top of Actions, React 19 introduces [`useOptimistic`](#new-hook-optimistic-updates) to manage optimistic updates, and a new hook [`React.useActionState`](#new-hook-useactionstate) to handle common cases for Actions. In `react-dom` we're adding [`<form>` Actions](#form-actions) to manage forms automatically and [`useFormStatus`](#new-hook-useformstatus) to support the common cases for Actions in forms.
119119

120120
In React 19, the above example can be simplified to:
121121

@@ -173,19 +173,19 @@ See [#28491](https://github.com/facebook/react/pull/28491) for more info.
173173

174174
For more information, see the docs for [`useActionState`](/reference/react/useActionState).
175175

176-
### `<form>` Actions {/*form-actions*/}
176+
### React DOM: `<form>` Actions {/*form-actions*/}
177177

178-
Actions are also integrated with React 19's new `<form>` features. We've added support for passing functions as the `action` and `formAction` props of `<form>`, `<input>`, and `<button>` elements to automatically submit forms with Actions:
178+
Actions are also integrated with React 19's new `<form>` features for `react-dom`. We've added support for passing functions as the `action` and `formAction` props of `<form>`, `<input>`, and `<button>` elements to automatically submit forms with Actions:
179179

180180
```js [[1,1,"actionFunction"]]
181181
<form action={actionFunction}>
182182
```
183183

184184
When a `<form>` Action succeeds, React will automatically reset the form for uncontrolled components. If you need to reset the `<form>` manually, you can call the new `requestFormReset` React DOM API.
185185

186-
For more information, see the docs for [`<form>`](/reference/react-dom/components/form), [`<input>`](/reference/react-dom/components/input), and [`<button>`](/reference/react-dom/components/button).
186+
For more information, see the `react-dom` docs for [`<form>`](/reference/react-dom/components/form), [`<input>`](/reference/react-dom/components/input), and [`<button>`](/reference/react-dom/components/button).
187187

188-
### New hook: `useFormStatus` {/*new-hook-useformstatus*/}
188+
### React DOM: New hook: `useFormStatus` {/*new-hook-useformstatus*/}
189189

190190
In design systems, it's common to write design components that need access to information about the `<form>` they're in, without drilling props down to the component. This can be done via Context, but to make the common case easier, we've added a new hook `useFormStatus`:
191191

@@ -198,7 +198,7 @@ function DesignButton() {
198198

199199
`useFormStatus` reads the status of the parent `<form>` as if the form was a Context provider.
200200

201-
For more information, see the docs for [`useFormStatus`](/reference/react-dom/hooks/useFormStatus).
201+
For more information, see the `react-dom` docs for [`useFormStatus`](/reference/react-dom/hooks/useFormStatus).
202202

203203
### New hook: `useOptimistic` {/*new-hook-optimistic-updates*/}
204204

@@ -366,7 +366,7 @@ New function components will no longer need `forwardRef`, and we will be publish
366366

367367
### Diffs for hydration errors {/*diffs-for-hydration-errors*/}
368368

369-
We also improved error reporting for hydration errors. For example, instead of logging multiple errors in DEV without any information about the mismatch:
369+
We also improved error reporting for hydration errors in `react-dom`. For example, instead of logging multiple errors in DEV without any information about the mismatch:
370370

371371
<ConsoleBlockMulti>
372372

0 commit comments

Comments
 (0)