Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/content/learn/manipulating-the-dom-with-refs.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ Then, use it to declare a ref inside your component:
const myRef = useRef(null);
```

Finally, pass it to the DOM node as the `ref` attribute:
Finally, pass your ref as the `ref` attribute to the JSX tag for which you want to get the DOM node:

```js
<div ref={myRef}>
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/option.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ The [built-in browser `<option>` component](https://developer.mozilla.org/en-US/

### `<option>` {/*option*/}

The [built-in browser `<option>` component](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) lets you render an option inside a [`<select>`](/reference/react-dom/components/select) box.
The [built-in browser `<option>` component](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) lets you render an option inside a [`<select>`](/reference/react-dom/components/select) box.

```js
<select>
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/progress.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ To display a progress indicator, render the [built-in browser `<progress>`](http
Additionally, `<progress>` supports these props:

* [`max`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress#attr-max): A number. Specifies the maximum `value`. Defaults to `1`.
* [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress#attr-value): A number between `0` and `max`, or `null` for intermedinate progress. Specifies how much was done.
* [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress#attr-value): A number between `0` and `max`, or `null` for indeterminate progress. Specifies how much was done.

---

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -286,7 +286,7 @@ Streaming does not need to wait for React itself to load in the browser, or for

**Only Suspense-enabled data sources will activate the Suspense component.** They include:

- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/advanced-features/react-18)
- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/getting-started/react-essentials)
- Lazy-loading component code with [`lazy`](/reference/react/lazy)

Suspense **does not** detect when data is fetched inside an Effect or event handler.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -285,7 +285,7 @@ Streaming does not need to wait for React itself to load in the browser, or for

**Only Suspense-enabled data sources will activate the Suspense component.** They include:

- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/advanced-features/react-18)
- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/getting-started/react-essentials)
- Lazy-loading component code with [`lazy`](/reference/react/lazy)

Suspense **does not** detect when data is fetched inside an Effect or event handler.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react/Suspense.md
Original file line number Diff line number Diff line change
Expand Up @@ -252,7 +252,7 @@ async function getAlbums() {

**Only Suspense-enabled data sources will activate the Suspense component.** They include:

- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/advanced-features/react-18)
- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/getting-started/react-essentials)
- Lazy-loading component code with [`lazy`](/reference/react/lazy)

Suspense **does not** detect when data is fetched inside an Effect or event handler.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react/useDeferredValue.md
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ During updates, the <CodeStep step={2}>deferred value</CodeStep> will "lag behin

This example assumes you use one of Suspense-enabled data sources:

- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/advanced-features/react-18)
- Data fetching with Suspense-enabled frameworks like [Relay](https://relay.dev/docs/guided-tour/rendering/loading-states/) and [Next.js](https://nextjs.org/docs/getting-started/react-essentials)
- Lazy-loading component code with [`lazy`](/reference/react/lazy)

[Learn more about Suspense and its limitations.](/reference/react/Suspense)
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react/useEffect.md
Original file line number Diff line number Diff line change
Expand Up @@ -1089,7 +1089,7 @@ function ChatRoom({ roomId }) {
}
```
**To remove a dependency, you need to ["prove" to the linter *doesn't need* to be a dependency.](/learn/removing-effect-dependencies#removing-unnecessary-dependencies)** For example, you can move `serverUrl` out of your component to prove that it's not reactive and won't change on re-renders:
**To remove a dependency, you need to ["prove" to the linter that it *doesn't need* to be a dependency.](/learn/removing-effect-dependencies#removing-unnecessary-dependencies)** For example, you can move `serverUrl` out of your component to prove that it's not reactive and won't change on re-renders:
```js {1,8}
const serverUrl = 'https://localhost:1234'; // Not a reactive value anymore
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react/useLayoutEffect.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ useLayoutEffect(setup, dependencies?)

### `useLayoutEffect(setup, dependencies?)` {/*useinsertioneffect*/}

Call `useLayoutEffect` perform the layout measurements before the browser repaints the screen:
Call `useLayoutEffect` to perform the layout measurements before the browser repaints the screen:

```js
import { useState, useRef, useLayoutEffect } from 'react';
Expand Down