Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Translate startTransition.md to Portuguese #1061

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Translate startTransition.md to Portuguese #1061

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
48 changes: 24 additions & 24 deletions src/content/reference/react/startTransition.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: startTransition

<Intro>

`startTransition` lets you render a part of the UI in the background.
`startTransition` permite que você renderize uma parte da UI em background.

```js
startTransition(action)
Expand All @@ -16,11 +16,11 @@ startTransition(action)

---

## Reference {/*reference*/}
## Referência {/*reference*/}

### `startTransition(action)` {/*starttransition*/}

The `startTransition` function lets you mark a state update as a Transition.
A função `startTransition` permite que você marque uma atualização de estado como uma Transition.

```js {7,9}
import { startTransition } from 'react';
Expand All @@ -37,39 +37,39 @@ function TabContainer() {
}
```

[See more examples below.](#usage)
[Veja mais exemplos abaixo.](#usage)

#### Parameters {/*parameters*/}
#### Parâmetros {/*parameters*/}

* `action`: A function that updates some state by calling one or more [`set` functions](/reference/react/useState#setstate). React calls `action` immediately with no parameters and marks all state updates scheduled synchronously during the `action` function call as Transitions. Any async calls awaited in the `action` will be included in the transition, but currently require wrapping any `set` functions after the `await` in an additional `startTransition` (see [Troubleshooting](/reference/react/useTransition#react-doesnt-treat-my-state-update-after-await-as-a-transition)). State updates marked as Transitions will be [non-blocking](#marking-a-state-update-as-a-non-blocking-transition) and [will not display unwanted loading indicators.](/reference/react/useTransition#preventing-unwanted-loading-indicators).
* `action`: Uma função que atualiza algum `state` chamando uma ou mais funções [`set`](/reference/react/useState#setstate). React chama `action` imediatamente sem parâmetros e marca todas as atualizações de `state` agendadas de forma síncrona durante a chamada da função `action` como Transitions. Quaisquer chamadas assíncronas aguardadas no `action` serão incluídas na transition, mas atualmente requerem encapsular quaisquer funções `set` após o `await` em um `startTransition` adicional (veja [Solução de problemas](/reference/react/useTransition#react-doesnt-treat-my-state-update-after-await-as-a-transition)). Atualizações de `state` marcadas como Transitions serão [não bloqueantes](#marking-a-state-update-as-a-non-blocking-transition) e [não exibirão indicadores de carregamento indesejados.](/reference/react/useTransition#preventing-unwanted-loading-indicators).

#### Returns {/*returns*/}
#### Retorna {/*returns*/}

`startTransition` does not return anything.
`startTransition` não retorna nada.

#### Caveats {/*caveats*/}
#### Ressalvas {/*caveats*/}

* `startTransition` does not provide a way to track whether a Transition is pending. To show a pending indicator while the Transition is ongoing, you need [`useTransition`](/reference/react/useTransition) instead.
* `startTransition` não fornece uma maneira de rastrear se uma Transition está pendente. Para mostrar um indicador pendente enquanto a Transition está em andamento, você precisa de [`useTransition`](/reference/react/useTransition) em vez disso.

* You can wrap an update into a Transition only if you have access to the `set` function of that state. If you want to start a Transition in response to some prop or a custom Hook return value, try [`useDeferredValue`](/reference/react/useDeferredValue) instead.
* Você pode encapsular uma atualização em uma Transition somente se tiver acesso à função `set` desse `state`. Se você deseja iniciar uma Transition em resposta a alguma `prop` ou um valor de retorno de um Hook customizado, tente [`useDeferredValue`](/reference/react/useDeferredValue) em vez disso.

* The function you pass to `startTransition` is called immediately, marking all state updates that happen while it executes as Transitions. If you try to perform state updates in a `setTimeout`, for example, they won't be marked as Transitions.
* A função que você passa para `startTransition` é chamada imediatamente, marcando todas as atualizações de `state` que acontecem enquanto ela é executada como Transitions. Se você tentar executar atualizações de `state` em um `setTimeout`, por exemplo, elas não serão marcadas como Transitions.

* You must wrap any state updates after any async requests in another `startTransition` to mark them as Transitions. This is a known limitation that we will fix in the future (see [Troubleshooting](/reference/react/useTransition#react-doesnt-treat-my-state-update-after-await-as-a-transition)).
* Você deve encapsular quaisquer atualizações de `state` após quaisquer solicitações assíncronas em outro `startTransition` para marcá-las como Transitions. Esta é uma limitação conhecida que corrigiremos no futuro (veja [Solução de problemas](/reference/react/useTransition#react-doesnt-treat-my-state-update-after-await-as-a-transition)).

* A state update marked as a Transition will be interrupted by other state updates. For example, if you update a chart component inside a Transition, but then start typing into an input while the chart is in the middle of a re-render, React will restart the rendering work on the chart component after handling the input state update.
* Uma atualização de `state` marcada como uma Transition será interrompida por outras atualizações de `state`. Por exemplo, se você atualizar um componente de gráfico dentro de uma Transition, mas depois começar a digitar em uma entrada enquanto o gráfico está no meio de uma re-renderização, React reiniciará o trabalho de renderização no componente de gráfico após manipular a atualização de `state` da entrada.

* Transition updates can't be used to control text inputs.
* Atualizações de Transition não podem ser usadas para controlar entradas de texto.

* If there are multiple ongoing Transitions, React currently batches them together. This is a limitation that may be removed in a future release.
* Se houver várias Transitions em andamento, React atualmente as agrupa. Esta é uma limitação que pode ser removida em uma versão futura.

---

## Usage {/*usage*/}
## Uso {/*usage*/}

### Marking a state update as a non-blocking Transition {/*marking-a-state-update-as-a-non-blocking-transition*/}
### Marcando uma atualização de `state` como uma Transition não bloqueante {/*marking-a-state-update-as-a-non-blocking-transition*/}

You can mark a state update as a *Transition* by wrapping it in a `startTransition` call:
Você pode marcar uma atualização de `state` como uma *Transition* encapsulando-a em uma chamada `startTransition`:

```js {7,9}
import { startTransition } from 'react';
Expand All @@ -86,14 +86,14 @@ function TabContainer() {
}
```

Transitions let you keep the user interface updates responsive even on slow devices.
Transitions permitem que você mantenha as atualizações da interface do usuário responsivas, mesmo em dispositivos lentos.

With a Transition, your UI stays responsive in the middle of a re-render. For example, if the user clicks a tab but then change their mind and click another tab, they can do that without waiting for the first re-render to finish.
Com uma Transition, sua UI permanece responsiva no meio de uma re-renderização. Por exemplo, se o usuário clicar em uma aba, mas depois mudar de ideia e clicar em outra aba, ele pode fazê-lo sem esperar que a primeira re-renderização termine.

<Note>

`startTransition` is very similar to [`useTransition`](/reference/react/useTransition), except that it does not provide the `isPending` flag to track whether a Transition is ongoing. You can call `startTransition` when `useTransition` is not available. For example, `startTransition` works outside components, such as from a data library.
`startTransition` é muito semelhante ao [`useTransition`](/reference/react/useTransition), exceto que não fornece a flag `isPending` para rastrear se uma Transition está em andamento. Você pode chamar `startTransition` quando `useTransition` não estiver disponível. Por exemplo, `startTransition` funciona fora dos componentes, como de uma biblioteca de dados.

[Learn about Transitions and see examples on the `useTransition` page.](/reference/react/useTransition)
[Saiba mais sobre Transitions e veja exemplos na página `useTransition`.](/reference/react/useTransition)

</Note>
</Note>