Skip to content

Commit

Permalink
docs(cn): translate reference/react/use-server into Chinese (#1250)
Browse files Browse the repository at this point in the history
  • Loading branch information
Yucohny authored Jul 6, 2023
1 parent b12b492 commit 765babb
Showing 1 changed file with 12 additions and 12 deletions.
24 changes: 12 additions & 12 deletions src/content/reference/react/use-server.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,28 +4,28 @@ title: "'use server'"

<Wip>

This section is incomplete.
此章节仍在完善中。

These directives are needed only if you're [using React Server Components](/learn/start-a-new-react-project#bleeding-edge-react-frameworks) or building a library compatible with them.
这些指令仅在你 [使用 React 服务器组件](/learn/start-a-new-react-project#bleeding-edge-react-frameworks) 或构建可适配库时需要。

</Wip>


<Intro>

`'use server'` marks server-side functions that can be called from client-side code.
`'use server'` 标记可以从客户端代码调用的服务器函数。

</Intro>

<InlineToc />

---

## Reference {/*reference*/}
## 参考 {/*reference*/}

### `'use server'` {/*use-server*/}

Add `'use server';` at the very top of an async function to mark that the function can be executed by the client.
在异步函数的最顶部添加 `'use server'` 以标记该函数可以被客户端执行。

```js
async function addToCart(data) {
Expand All @@ -36,13 +36,13 @@ async function addToCart(data) {
// <ProductDetailPage addToCart={addToCart} />
```

This function can be passed to the client. When called on the client, it will make a network request to the server that includes a serialized copy of any arguments passed. If the server function returns a value, that value will be serialized and returned to the client.
上面这个函数可以传递给客户端。当在客户端调用时,它会向服务器发起网络请求,其中包含传递的任何参数的序列化副本。如果服务器函数返回一个值,该值将在序列化后返回给客户端。

Alternatively, add `'use server';` at the very top of a file to mark all exports within that file as async server functions that can be used anywhere, including imported in client component files.
另外,可以在文件的最顶部添加 `'use server';` 来将该文件中的所有导出标记为可以在任何地方使用的异步服务器函数,包括在客户端组件文件中导入。

#### Caveats {/*caveats*/}
#### 注意 {/*caveats*/}

* Remember that parameters to functions marked with `'use server'` are fully client-controlled. For security, always treat them as untrusted input, making sure to validate and escape the arguments as appropriate.
* To avoid the confusion that might result from mixing client- and server-side code in the same file, `'use server'` can only be used in server-side files; the resulting functions can be passed to client components through props.
* Because the underlying network calls are always asynchronous, `'use server'` can be used only on async functions.
* Directives like `'use server'` must be at the very beginning of their function or file, above any other code including imports (comments above directives are OK). They must be written with single or double quotes, not backticks. (The `'use xyz'` directive format somewhat resembles the `useXyz()` Hook naming convention, but the similarity is coincidental.)
* 请记住,使用 `'use server'` 标记的函数的参数是完全由客户端控制的。因此,为了安全起见,请始终将它们视为不可信的输入,并确保根据需要进行验证和转义。
* 为了避免将客户端和服务器代码混合在同一文件中从而导致混淆,`'use server'` 只能在服务器文件中使用;生成的函数可以通过 props 传递给客户端组件。
* 底层的网络调用总是异步的,所以 `'use server'` 只能在异步函数上使用。
* `'use server'` 这样的指令必须位于文件或函数的最开头,位于任何导入或其他代码之上(指令上方可以存在注释)。它们必须用单引号或双引号编写,而不是反引号。`'use xyz'` 指令格式类似于 `'useXyz'` Hook 命名约定,但相似之处纯属巧合。

0 comments on commit 765babb

Please sign in to comment.