You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/reference/rsc/server-functions.md
+37-39
Original file line number
Diff line number
Diff line change
@@ -1,50 +1,50 @@
1
1
---
2
-
title: Server Functions
2
+
title: Funções do Servidor
3
3
---
4
4
5
5
<RSC>
6
6
7
-
Server Functions are for use in [React Server Components](/learn/start-a-new-react-project#bleeding-edge-react-frameworks).
7
+
Funções do Servidor são para uso em [Componentes do Servidor React](/learn/start-a-new-react-project#bleeding-edge-react-frameworks).
8
8
9
-
**Note:**Until September 2024, we referred to all Server Functions as "Server Actions". If a Server Function is passed to an action prop or called from inside an action then it is a Server Action, but not all Server Functions are Server Actions. The naming in this documentation has been updated to reflect that Server Functions can be used for multiple purposes.
9
+
**Observação:**Até setembro de 2024, nos referíamos a todas as Funções do Servidor como "Ações do Servidor". Se uma Função do Servidor for passada para uma propriedade `action` ou chamada de dentro de uma ação, então ela é uma Ação do Servidor, mas nem todas as Funções do Servidor são Ações do Servidor. A nomenclatura nesta documentação foi atualizada para refletir que as Funções do Servidor podem ser usadas para múltiplos propósitos.
10
10
11
11
</RSC>
12
12
13
13
<Intro>
14
14
15
-
Server Functions allow Client Components to call async functions executed on the server.
15
+
As Funções do Servidor permitem que Componentes Cliente chamem funções assíncronas executadas no servidor.
16
16
17
17
</Intro>
18
18
19
19
<InlineToc />
20
20
21
21
<Note>
22
22
23
-
#### How do I build support for Server Functions? {/*how-do-i-build-support-for-server-functions*/}
23
+
#### Como eu construo suporte para as Funções do Servidor? {/*how-do-i-build-support-for-server-functions*/}
24
24
25
-
While Server Functions in React 19 are stable and will not break between minor versions, the underlying APIs used to implement Server Functions in a React Server Components bundler or framework do not follow semver and may break between minors in React 19.x.
25
+
Embora as Funções do Servidor no React 19 sejam estáveis e não quebrarão entre versões secundárias, as APIs subjacentes usadas para implementar Funções do Servidor em um bundler ou framework de Componentes do Servidor React não seguem semver e podem quebrar entre secundárias no React 19.x.
26
26
27
-
To support Server Functions as a bundler or framework, we recommend pinning to a specific React version, or using the Canary release. We will continue working with bundlers and frameworks to stabilize the APIs used to implement Server Functions in the future.
27
+
Para oferecer suporte às Funções do Servidor como um bundler ou framework, recomendamos fixar em uma versão específica do React ou usar o lançamento Canary. Continuaremos trabalhando com bundlers e frameworks para estabilizar as APIs usadas para implementar Funções do Servidor no futuro.
28
28
29
29
</Note>
30
30
31
-
When a Server Functions is defined with the [`"use server"`](/reference/rsc/use-server) directive, your framework will automatically create a reference to the server function, and pass that reference to the Client Component. When that function is called on the client, React will send a request to the server to execute the function, and return the result.
31
+
Quando uma Função do Servidor é definida com a diretiva [`"use server"`](/reference/rsc/use-server), seu framework criará automaticamente uma referência à função do servidor e passará essa referência para o Componente Cliente. Quando essa função for chamada no cliente, o React enviará uma requisição para o servidor para executar a função e retornará o resultado.
32
32
33
-
Server Functions can be created in Server Components and passed as props to Client Components, or they can be imported and used in Client Components.
33
+
As Funções do Servidor podem ser criadas em Componentes do Servidor e passadas como props para Componentes Cliente, ou podem ser importadas e usadas em Componentes Cliente.
34
34
35
-
## Usage {/*usage*/}
35
+
## Uso {/*usage*/}
36
36
37
-
### Creating a Server Function from a Server Component {/*creating-a-server-function-from-a-server-component*/}
37
+
### Criando uma Função do Servidor de um Componente do Servidor {/*creating-a-server-function-from-a-server-component*/}
38
38
39
-
Server Components can define Server Functions with the `"use server"` directive:
39
+
Componentes do Servidor podem definir Funções do Servidor com a diretiva `"use server"`:
When React renders the `EmptyNote` Server Function, it will create a reference to the `createNoteAction`function, and pass that reference to the `Button` Client Component. When the button is clicked, React will send a request to the server to execute the`createNoteAction`function with the reference provided:
57
+
Quando o React renderiza a Função do Servidor `EmptyNote`, ele criará uma referência à função `createNoteAction`e passará essa referência para o Componente Cliente `Button`. Quando o botão for clicado, o React enviará uma requisição para o servidor para executar a função`createNoteAction`com a referência fornecida:
58
58
59
59
```js {5}
60
60
"use client";
@@ -66,12 +66,11 @@ export default function Button({onClick}) {
66
66
}
67
67
```
68
68
69
-
For more, see the docs for[`"use server"`](/reference/rsc/use-server).
69
+
Para mais informações, consulte a documentação para[`"use server"`](/reference/rsc/use-server).
70
70
71
+
### Importando Funções do Servidor de Componentes Cliente {/*importing-server-functions-from-client-components*/}
71
72
72
-
### Importing Server Functions from Client Components {/*importing-server-functions-from-client-components*/}
73
-
74
-
Client Components can import Server Functions from files that use the `"use server"` directive:
73
+
Componentes Cliente podem importar Funções do Servidor de arquivos que usam a diretiva `"use server"`:
75
74
76
75
```js [[1, 3, "createNote"]]
77
76
"use server";
@@ -82,7 +81,7 @@ export async function createNote() {
82
81
83
82
```
84
83
85
-
When the bundler builds the `EmptyNote` Client Component, it will create a reference to the `createNote`function in the bundle. When the`button`is clicked, React will send a request to the server to execute the`createNote`function using the reference provided:
84
+
Quando o bundler constrói o Componente Cliente `EmptyNote`, ele criará uma referência à função `createNote`no bundle. Quando o`button`for clicado, o React enviará uma requisição para o servidor para executar a função`createNote`usando a referência fornecida:
For more, see the docs for[`"use server"`](/reference/rsc/use-server).
97
+
Para mais informações, consulte a documentação para[`"use server"`](/reference/rsc/use-server).
99
98
100
-
### Server Functions with Actions {/*server-functions-with-actions*/}
99
+
### Funções do Servidor com Ações {/*server-functions-with-actions*/}
101
100
102
-
Server Functions can be called from Actions on the client:
101
+
Funções do Servidor podem ser chamadas de Ações no cliente:
103
102
104
103
```js [[1, 3, "updateName"]]
105
104
"use server";
@@ -143,16 +142,15 @@ function UpdateName() {
143
142
}
144
143
```
145
144
146
-
This allows you to access the `isPending` state of the Server Function by wrapping it in an Action on the client.
147
-
148
-
For more, see the docs for [Calling a Server Function outside of `<form>`](/reference/rsc/use-server#calling-a-server-function-outside-of-form)
145
+
Isso permite que você acesse o estado `isPending` da Função do Servidor, encapsulando-a em uma Ação no cliente.
149
146
150
-
### Server Functions with Form Actions {/*using-server-functions-with-form-actions*/}
147
+
Para mais informações, consulte a documentação para [Chamando uma Função do Servidor fora de `<form>`](/reference/rsc/use-server#calling-a-server-function-outside-of-form)
151
148
152
-
Server Functions work with the new Form features in React 19.
149
+
### Funções do Servidor com Ações de Formulário {/*using-server-functions-with-form-actions*/}
153
150
154
-
You can pass a Server Function to a Form to automatically submit the form to the server:
151
+
Funções do Servidor funcionam com os novos recursos de Formulário no React 19.
155
152
153
+
Você pode passar uma Função do Servidor para um Formulário para automaticamente enviar o formulário ao servidor:
When the Form submission succeeds, React will automatically reset the form. You can add`useActionState`to access the pending state, last response, or to support progressive enhancement.
169
+
Quando a submissão do Formulário for bem-sucedida, o React redefinirá automaticamente o formulário. Você pode adicionar`useActionState`para acessar o estado pendente, a última resposta ou para oferecer suporte a aprimoramento progressivo.
172
170
173
-
For more, see the docs for [Server Functions in Forms](/reference/rsc/use-server#server-functions-in-forms).
171
+
Para mais informações, consulte a documentação para [Funções do Servidor em Formulários](/reference/rsc/use-server#server-functions-in-forms).
174
172
175
-
### Server Functions with`useActionState` {/*server-functions-with-use-action-state*/}
173
+
### Funções do Servidor com`useActionState` {/*server-functions-with-use-action-state*/}
176
174
177
-
You can call Server Functions with `useActionState`for the common case where you just need access to the action pending state and last returned response:
175
+
Você pode chamar Funções do Servidor com `useActionState`para o caso comum em que você só precisa acessar o estado pendente da ação e a última resposta retornada:
When using`useActionState`with Server Functions, React will also automatically replay form submissions entered before hydration finishes. This means users can interact with your app even before the app has hydrated.
194
+
Ao usar`useActionState`com Funções do Servidor, o React também reproduzirá automaticamente as submissões de formulário inseridas antes que a hidratação termine. Isso significa que os usuários podem interagir com seu aplicativo mesmo antes que o aplicativo tenha hidratado.
197
195
198
-
For more, see the docs for[`useActionState`](/reference/react-dom/hooks/useFormState).
196
+
Para mais informações, consulte a documentação para[`useActionState`](/reference/react-dom/hooks/useFormState).
When the <CodeStepstep={2}>permalink</CodeStep> is provided to`useActionState`, React will redirect to the provided URL if the form is submitted before the JavaScript bundle loads.
218
+
Quando o <CodeStepstep={2}>permalink</CodeStep> for fornecido para`useActionState`, o React redirecionará para a URL fornecida se o formulário for enviado antes que o bundle JavaScript seja carregado.
221
219
222
-
For more, see the docs for[`useActionState`](/reference/react-dom/hooks/useFormState).
220
+
Para mais informações, consulte a documentação para[`useActionState`](/reference/react-dom/hooks/useFormState).
0 commit comments