diff --git a/src/content/learn/referencing-values-with-refs.md b/src/content/learn/referencing-values-with-refs.md index 657d3ddcb00..e0cda57a58d 100644 --- a/src/content/learn/referencing-values-with-refs.md +++ b/src/content/learn/referencing-values-with-refs.md @@ -655,6 +655,39 @@ export default function Chat() { +If you don't need the input to be controlled (e.g., no live validation or display elsewhere), you can skip state entirely and read the DOM value directly via a ref. + + + +```js +import { useRef } from 'react'; + +export default function Chat() { + const inputRef = useRef(null); + + function handleSend() { + setTimeout(() => { + alert('Sending: ' + inputRef.current.value); + }, 3000); + } + + return ( + <> + + + + ); +} +``` + + + + diff --git a/src/content/learn/writing-markup-with-jsx.md b/src/content/learn/writing-markup-with-jsx.md index be3a9ac2cdb..4c4c59c3f00 100644 --- a/src/content/learn/writing-markup-with-jsx.md +++ b/src/content/learn/writing-markup-with-jsx.md @@ -74,7 +74,7 @@ Suppose that you have some (perfectly valid) HTML: src="https://react.dev/images/docs/scientists/yXOvdOSs.jpg" alt="Hedy Lamarr" class="photo" -> +/>