From 711ddd7c3905d90fc69722284ffe6635af9b0f47 Mon Sep 17 00:00:00 2001 From: jhonmike Date: Tue, 29 Jul 2025 07:37:47 -0300 Subject: [PATCH] fix: correct dead links in documentation --- src/content/learn/adding-interactivity.md | 4 ++-- src/content/learn/keeping-components-pure.md | 2 +- src/content/learn/typescript.md | 4 ++-- src/content/learn/you-might-not-need-an-effect.md | 2 +- .../reference/react-dom/server/renderToPipeableStream.md | 4 ++-- .../reference/react-dom/server/renderToReadableStream.md | 4 ++-- src/content/reference/react/Component.md | 6 +++--- src/content/reference/react/Suspense.md | 2 +- src/content/reference/react/useImperativeHandle.md | 2 +- src/content/reference/react/useState.md | 6 +++--- src/content/reference/react/useSyncExternalStore.md | 4 ++-- src/content/reference/rsc/use-client.md | 2 +- src/content/reference/rsc/use-server.md | 2 +- 13 files changed, 22 insertions(+), 22 deletions(-) diff --git a/src/content/learn/adding-interactivity.md b/src/content/learn/adding-interactivity.md index 2c6c160bf..34937be0e 100644 --- a/src/content/learn/adding-interactivity.md +++ b/src/content/learn/adding-interactivity.md @@ -76,7 +76,7 @@ Leia **[Respondendo a Eventos](/learn/responding-to-events)** para aprender como Componentes necessitam de alterar frequentemente o que está na tela como resultado de uma interação. O campo de entrada será atualizado ao digitar em um formulário, a imagem exibida será trocada ao clicar em "próxima" em um carrossel de imagens, um produto é colocado no carrinho de compras ao clicar em "comprar". Componentes precisam "memorizar" informações: o valor de entrada ou a imagem atual, assim como o carrinho de compras, por exemplo. Em React, este tipo de memória específica de componente é chamada de *state.* -É possível adicionar states a componentes com um Hook [`useState`](/apis/usestate). Hooks são funções especiais que possibilitam que seus componentes utilizem recursos do React (como o state, por exemplo). O Hook `useState` possibilita a declaração de uma variável de estado. Este recurso recebe o state inicial e retorna um par de valores: o state atual e uma função setter, que possibilita atualizá-lo. +É possível adicionar states a componentes com um Hook [`useState`](/reference/react/useState). Hooks são funções especiais que possibilitam que seus componentes utilizem recursos do React (como o state, por exemplo). O Hook `useState` possibilita a declaração de uma variável de estado. Este recurso recebe o state inicial e retorna um par de valores: o state atual e uma função setter, que possibilita atualizá-lo. ```js const [index, setIndex] = useState(0); @@ -799,4 +799,4 @@ Leia **[Atualizando Arrays no State](/learn/updating-arrays-in-state)** para apr Vá até [Respondendo a Eventos](/learn/responding-to-events) para começar a ler este capítulo página por página! -Ou, se você já está familiarizado com estes tópicos, por que não ler sobre [Gerenciando o Estado](/learn/managing-state)? \ No newline at end of file +Ou, se você já está familiarizado com estes tópicos, por que não ler sobre [Gerenciando o Estado](/learn/managing-state)? diff --git a/src/content/learn/keeping-components-pure.md b/src/content/learn/keeping-components-pure.md index 67fe03fe6..70049e58e 100644 --- a/src/content/learn/keeping-components-pure.md +++ b/src/content/learn/keeping-components-pure.md @@ -195,7 +195,7 @@ While functional programming relies heavily on purity, at some point, somewhere, In React, **side effects usually belong inside [event handlers.](/learn/responding-to-events)** Event handlers are functions that React runs when you perform some action—for example, when you click a button. Even though event handlers are defined *inside* your component, they don't run *during* rendering! **So event handlers don't need to be pure.** -If you've exhausted all other options and can't find the right event handler for your side effect, you can still attach it to your returned JSX with a [`useEffect`](/apis/useeffect) call in your component. This tells React to execute it later, after rendering, when side effects are allowed. **However, this approach should be your last resort.** +If you've exhausted all other options and can't find the right event handler for your side effect, you can still attach it to your returned JSX with a [`useEffect`](/reference/react/useEffect) call in your component. This tells React to execute it later, after rendering, when side effects are allowed. **However, this approach should be your last resort.** When possible, try to express your logic with rendering alone. You'll be surprised how far this can take you! diff --git a/src/content/learn/typescript.md b/src/content/learn/typescript.md index f24735bd4..9300c8a09 100644 --- a/src/content/learn/typescript.md +++ b/src/content/learn/typescript.md @@ -13,8 +13,8 @@ TypeScript é uma forma popular de adicionar definições de tipos à bases de c * [TypeScript com Componentes React](/learn/typescript#typescript-with-react-components) * [Exemplos de tipagem com hooks](/learn/typescript#example-hooks) -* [Tipos úteis do `@types/react`](/learn/typescript/#useful-types) -* [Conteúdo adicional para aprendizagem](/learn/typescript/#further-learning) +* [Tipos úteis do `@types/react`](/learn/typescript#useful-types) +* [Conteúdo adicional para aprendizagem](/learn/typescript#further-learning) diff --git a/src/content/learn/you-might-not-need-an-effect.md b/src/content/learn/you-might-not-need-an-effect.md index 1cf8ec83f..1a1480a70 100644 --- a/src/content/learn/you-might-not-need-an-effect.md +++ b/src/content/learn/you-might-not-need-an-effect.md @@ -341,7 +341,7 @@ function Form() { Vamos aplicar os mesmos critérios do exemplo anterior. -A solicitação POST de análise deve permanecer em um Effect. Isso ocorre porque o _motivo_ para enviar o evento de análise é que o formulário foi exibido. (Ele seria disparado duas vezes no desenvolvimento, mas [veja aqui](/learn/synchronizing-with-effects#enviar-análises) para saber como lidar com isso). +A solicitação POST de análise deve permanecer em um Effect. Isso ocorre porque o _motivo_ para enviar o evento de análise é que o formulário foi exibido. (Ele seria disparado duas vezes no desenvolvimento, mas [veja aqui](/learn/synchronizing-with-effects#sending-analytics) para saber como lidar com isso). No entanto, a solicitação POST `/api/register` não é causada pelo formulário que está sendo _exibido_. Você só deseja enviar a solicitação em um momento específico: quando o usuário pressiona o botão. Isso só deve acontecer _naquela interação específica_. Exclua o segundo Effect e mova essa solicitação POST para o manipulador de evento: diff --git a/src/content/reference/react-dom/server/renderToPipeableStream.md b/src/content/reference/react-dom/server/renderToPipeableStream.md index c6c5dde14..4acd6f951 100644 --- a/src/content/reference/react-dom/server/renderToPipeableStream.md +++ b/src/content/reference/react-dom/server/renderToPipeableStream.md @@ -431,7 +431,7 @@ function ProfilePage() { } ``` -Se ocorrer um erro no componente `Posts` ou em algum lugar dentro dele, o React [tentará se recuperar dele:](/reference/react/Suspense#providing-a-fallback-for-server-errors-and-client-only-content) +Se ocorrer um erro no componente `Posts` ou em algum lugar dentro dele, o React [tentará se recuperar dele:](/reference/react/Suspense#providing-a-fallback-for-server-errors-and-server-only-content) 1. Ele emitirá o fallback de carregamento para o `` mais próximo (`PostsGlimmer`) no HTML. 2. Ele "desistirá" de tentar renderizar o conteúdo `Posts` no servidor. @@ -605,4 +605,4 @@ setTimeout(() => { }, 10000); ``` -O React irá descarregar os fallbacks de carregamento restantes como HTML e tentará renderizar o restante no cliente. \ No newline at end of file +O React irá descarregar os fallbacks de carregamento restantes como HTML e tentará renderizar o restante no cliente. diff --git a/src/content/reference/react-dom/server/renderToReadableStream.md b/src/content/reference/react-dom/server/renderToReadableStream.md index 6731ab3d4..f0c83641e 100644 --- a/src/content/reference/react-dom/server/renderToReadableStream.md +++ b/src/content/reference/react-dom/server/renderToReadableStream.md @@ -433,7 +433,7 @@ function ProfilePage() { } ``` -Se um erro ocorrer no componente `Posts` ou em algum lugar dentro dele, o React [tentará se recuperar disso:](/reference/react/Suspense#providing-a-fallback-for-server-errors-and-client-only-content) +Se um erro ocorrer no componente `Posts` ou em algum lugar dentro dele, o React [tentará se recuperar disso:](/reference/react/Suspense#providing-a-fallback-for-server-errors-and-server-only-content) 1. Ele emitirá o fallback de carregamento para o limite `` mais próximo (`PostsGlimmer`) no HTML. 2. Ele "desistirá" de tentar renderizar o conteúdo `Posts` no servidor. @@ -620,4 +620,4 @@ async function handler(request) { // ... ``` -React descartará os fallbacks de carregamento restantes como HTML e tentará renderizar o restante no cliente. \ No newline at end of file +React descartará os fallbacks de carregamento restantes como HTML e tentará renderizar o restante no cliente. diff --git a/src/content/reference/react/Component.md b/src/content/reference/react/Component.md index 24e5bf224..b697bca85 100644 --- a/src/content/reference/react/Component.md +++ b/src/content/reference/react/Component.md @@ -786,7 +786,7 @@ Se você definir `UNSAFE_componentWillReceiveProps`, o React irá chamá-lo quan [Veja exemplos de como migrar de lifecycles inseguros.](https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#updating-state-based-on-props) -#### Parâmetros {/*unsafe_componentwillreceiveprops-parameters*/}```text +#### Parâmetros {/*unsafe_componentwillreceiveprops-parameters*/}```text {/*parâmetros-unsafe_componentwillreceiveprops-parameterstext*/} - `nextProps`: As próximas props que o componente está prestes a receber de seu componente pai. Compare `nextProps` com [`this.props`](#props) para determinar o que mudou. - `nextContext`: O próximo contexto que o componente está prestes a receber do provedor mais próximo. Compare `nextContext` com [`this.context`](#context) para determinar o que mudou. Disponível somente se você especificar [`static contextType`](#static-contexttype). @@ -806,7 +806,7 @@ Se você definir `UNSAFE_componentWillReceiveProps`, o React irá chamá-lo quan -Chamar [`setState`](#setstate) dentro de `UNSAFE_componentWillReceiveProps` em um componente de classe para "ajustar" o estado é equivalente a [chamar a função `set` de `useState` durante a renderização](/reference/react/useState#armazenando-informa%C3%A7%C3%B5es-de-renderiza%C3%A7%C3%B5es-anteriores) em um componente de função. +Chamar [`setState`](#setstate) dentro de `UNSAFE_componentWillReceiveProps` em um componente de classe para "ajustar" o estado é equivalente a [chamar a função `set` de `useState` durante a renderização](/reference/react/useState#storing-information-from-previous-renders) em um componente de função. @@ -1013,7 +1013,7 @@ Derivar o estado leva a um código prolixo e dificulta a reflexão sobre seus co -Implementar `static getDerivedStateFromProps` em um componente de classe é equivalente a [chamar a função `set` de `useState` durante a renderização](/reference/react/useState#armazenando-informa%C3%A7%C3%B5es-de-renderiza%C3%A7%C3%B5es-anteriores) em um componente de função. +Implementar `static getDerivedStateFromProps` em um componente de classe é equivalente a [chamar a função `set` de `useState` durante a renderização](/reference/react/useState#storing-information-from-previous-renders) em um componente de função. diff --git a/src/content/reference/react/Suspense.md b/src/content/reference/react/Suspense.md index 028dbfdd9..ee9829f02 100644 --- a/src/content/reference/react/Suspense.md +++ b/src/content/reference/react/Suspense.md @@ -2002,7 +2002,7 @@ No entanto, agora imagine que você está navegando entre dois perfis de usuári --- -### Fornecendo um fallback para erros no servidor e conteúdo somente do cliente {/*providing-a-fallback-for-server-errors-and-client-only-content*/} +### Fornecendo um fallback para erros no servidor e conteúdo somente do cliente {/*providing-a-fallback-for-server-errors-and-server-only-content*/} Se você usar uma das [APIs de renderização no servidor de streaming](/reference/react-dom/server) (ou um framework que dependa delas), React também usará seus limites de `` para lidar com erros no servidor. Se um componente lançar um erro no servidor, o React não abortará a renderização do servidor. Em vez disso, ele encontrará o componente `` mais próximo acima dele e incluirá seu fallback (como um spinner) no HTML do servidor gerado. O usuário verá um spinner no início. diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index 3627e8245..8265e25f3 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -60,7 +60,7 @@ A partir do React 19, [`ref` está disponível como uma prop.](/blog/2024/12/05/ ### Expondo um identificador de referência customizado ao componente pai {/*exposing-a-custom-ref-handle-to-the-parent-component*/} -Por padrão, os componentes não expõem seus nós DOM aos componentes pai. Por exemplo, se você deseja que o componente pai de `MyInput` [tenha acesso](/learn/manipulating-the-dom-with-refs) ao nó DOM ``, você deve optar por [`forwardRef`:](/referência/react/forwardRef) +Por padrão, os componentes não expõem seus nós DOM aos componentes pai. Por exemplo, se você deseja que o componente pai de `MyInput` [tenha acesso](/learn/manipulating-the-dom-with-refs) ao nó DOM ``, você deve optar por [`forwardRef`:](/reference/react/forwardRef) Para expor um nó DOM ao elemento pai, passe a prop `ref` para o nó. diff --git a/src/content/reference/react/useState.md b/src/content/reference/react/useState.md index 3f53fef79..60ef43b04 100644 --- a/src/content/reference/react/useState.md +++ b/src/content/reference/react/useState.md @@ -626,7 +626,7 @@ img { width: 200px; height: 200px; } -#### Lista (array) {/*list-array*/}```md +#### Lista (array) {/*list-array*/}```md {/*lista-array-list-arraymd*/} Neste exemplo, a variável de estado `todos` contém um array. Cada manipulador de botões chama `setTodos` com a próxima versão desse array. A sintaxe de espalhamento `[...todos]`, `todos.map()` e `todos.filter()` garante que o array de estado seja substituído em vez de mutado. @@ -883,7 +883,7 @@ function ItemList({ artworks, onToggle }) { --- -### Evitando recriar o estado inicial {/*evitando-recriar-o-estado-inicial*/} +### Evitando recriar o estado inicial {/*avoiding-recreating-the-initial-state*/} React salva o estado inicial uma vez e o ignora nas próximas renderizações. @@ -1070,7 +1070,7 @@ button { display: block; margin-bottom: 20px; } --- -### Armazenando informações das renderizações anteriores {/*armazenando-informacoes-das-renderizacoes-anteriores*/} +### Armazenando informações das renderizações anteriores {/*storing-information-from-previous-renders*/} Normalmente, você atualizará o estado em manipuladores de eventos. No entanto, em casos raros, você pode querer ajustar o estado em resposta à renderização -- por exemplo, você pode querer alterar uma variável de estado quando uma prop for alterada. diff --git a/src/content/reference/react/useSyncExternalStore.md b/src/content/reference/react/useSyncExternalStore.md index 5c7718623..89e6c2086 100644 --- a/src/content/reference/react/useSyncExternalStore.md +++ b/src/content/reference/react/useSyncExternalStore.md @@ -361,7 +361,7 @@ A função `getServerSnapshot` é semelhante a `getSnapshot`, mas ela é executa * Ele é executado no servidor ao gerar o HTML. * Ele é executado no cliente durante a [hidratação](/reference/react-dom/client/hydrateRoot), ou seja, quando o React pega o HTML do servidor e o torna interativo. -Isso permite que você forneça o valor inicial do snapshot, que será usado antes que o aplicativo se torne interativo. Se não houver um valor inicial significativo para a renderização do servidor, omita este argumento para [forçar a renderização no cliente.](/reference/react/Suspense#providing-a-fallback-for-server-errors-and-client-only-content) +Isso permite que você forneça o valor inicial do snapshot, que será usado antes que o aplicativo se torne interativo. Se não houver um valor inicial significativo para a renderização do servidor, omita este argumento para [forçar a renderização no cliente.](/reference/react/Suspense#providing-a-fallback-for-server-errors-and-server-only-content) @@ -445,4 +445,4 @@ function ChatIndicator({ userId }) { // ... } -``` \ No newline at end of file +``` diff --git a/src/content/reference/rsc/use-client.md b/src/content/reference/rsc/use-client.md index 8c0d32fef..68afb7c05 100644 --- a/src/content/reference/rsc/use-client.md +++ b/src/content/reference/rsc/use-client.md @@ -245,7 +245,7 @@ Para simplicidade, falamos sobre Componentes do Servidor, mas os mesmos princíp * Componentes do Servidor não podem usar a maioria dos Hooks. * Quando os Componentes do Servidor são renderizados, sua saída é essencialmente uma lista de componentes para o cliente renderizar. Componentes do Servidor não persistem em memória após a renderização e não podem ter seu próprio estado. -### Tipos serializáveis retornados por Componentes do Servidor {/*serializable-types*/} +### Tipos serializáveis retornados por Componentes do Servidor {/*passing-props-from-server-to-client-components*/} Como em qualquer aplicativo React, os componentes pai passam dados para os componentes filhos. Como eles são renderizados em ambientes diferentes, passar dados de um Componente do Servidor para um Componente do Cliente requer consideração extra. diff --git a/src/content/reference/rsc/use-server.md b/src/content/reference/rsc/use-server.md index 9e5490bc7..3ab71daf7 100644 --- a/src/content/reference/rsc/use-server.md +++ b/src/content/reference/rsc/use-server.md @@ -97,7 +97,7 @@ Notavelmente, estes não são suportados: Os valores de retorno serializáveis suportados são os mesmos que os [props serializáveis](/reference/rsc/use-client#passing-props-from-server-to-client-components) para um Client Component de limite. -Os valores de retorno serializáveis suportados são os mesmos que os [props serializáveis](/reference/rsc/use-client#serializable-types) para um Client Component de limite. +Os valores de retorno serializáveis suportados são os mesmos que os [props serializáveis](/reference/rsc/use-client#passing-props-from-server-to-client-components) para um Client Component de limite. ## Uso {/*usage*/}