Skip to content

Commit 72864e0

Browse files
committed
docs: update documentation translations
1 parent 0cdf549 commit 72864e0

File tree

5 files changed

+246
-193
lines changed

5 files changed

+246
-193
lines changed

apps/docs/content/zh-hans/docs/01-app/01-getting-started/02-project-structure.mdx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -203,8 +203,6 @@ Next.js 对项目文件组织方式**不做强制要求**,但提供了多种
203203
height="863"
204204
/>
205205

206-
</AppOnly>
207-
208206
### 文件同置 (Colocation)
209207

210208
`app` 目录中,嵌套文件夹定义了路由结构。每个文件夹代表一个路由片段,对应 URL 路径中的相应片段。

apps/docs/content/zh-hans/docs/01-app/01-getting-started/10-updating-data.mdx

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
source-updated-at: 2025-06-01T01:32:19.000Z
3-
translation-updated-at: 2025-06-01T01:32:19.000Z
2+
source-updated-at: 2025-06-03T15:30:49.000Z
3+
translation-updated-at: 2025-06-05T23:37:56.407Z
44
title: 如何更新数据
5-
nav_title: 更新数据
6-
description: 了解如何在 Next.js 应用中更新数据。
5+
nav_title: 数据更新
6+
description: 学习如何在 Next.js 应用中更新数据。
77
related:
88
title: API 参考
99
description: 通过阅读 API 参考文档了解更多本页提到的功能特性。
@@ -13,21 +13,21 @@ related:
1313
- app/api-reference/functions/redirect
1414
---
1515

16-
你可以使用 React 的 [Server Functions](https://react.dev/reference/rsc/server-functions) 在 Next.js 中更新数据。本页将介绍如何[创建](#creating-server-functions)[调用](#invoking-server-functions)服务端函数。
16+
您可以使用 React 的 [服务端函数 (Server Functions)](https://react.dev/reference/rsc/server-functions) 在 Next.js 中更新数据。本页将介绍如何[创建](#creating-server-functions)[调用](#invoking-server-functions)服务端函数。
1717

1818
## 服务端函数
1919

20-
服务端函数是在服务器端执行的异步函数。由于它们是通过客户端网络请求调用的,因此本质上是异步的。当作为 `action` 的一部分被调用时,它们也被称为**服务端操作 (Server Actions)**
20+
服务端函数是在服务器端执行的异步函数。由于它们是通过客户端发起的网络请求调用的,因此本质上是异步的。当作为 `action` 的一部分被调用时,它们也被称为**服务端操作 (Server Actions)**
2121

22-
按照约定,`action` 是传递给 `startTransition` 的异步函数。在以下情况下,服务端函数会自动被 `startTransition` 包裹:
22+
按照约定,`action` 是传递给 `startTransition` 的异步函数。服务端函数在以下情况下会自动被 `startTransition` 包裹:
2323

2424
- 通过 `action` 属性传递给 `<form>`
2525
- 通过 `formAction` 属性传递给 `<button>`
2626
- 传递给 `useActionState`
2727

2828
## 创建服务端函数
2929

30-
可以通过 [`use server`](https://react.dev/reference/rsc/use-server) 指令定义服务端函数。你可以将指令放在**异步**函数顶部来标记该函数为服务端函数,或者放在单独文件顶部来标记该文件的所有导出
30+
可以通过使用 [`use server`](https://react.dev/reference/rsc/use-server) 指令来定义服务端函数。您可以将该指令放在**异步**函数的顶部以将其标记为服务端函数,或者放在单独文件的顶部以标记该文件的所有导出
3131

3232
```ts filename="app/lib/actions.ts" switcher
3333
export async function createPost(formData: FormData) {
@@ -69,7 +69,7 @@ export async function deletePost(formData) {
6969

7070
### 服务端组件
7171

72-
通过将 `"use server"` 指令添加到函数体顶部,可以在服务端组件中内联定义服务端函数
72+
可以通过在函数体顶部添加 `"use server"` 指令,在服务端组件中内联定义服务端函数
7373

7474
```tsx filename="app/page.tsx" switcher
7575
export default function Page() {
@@ -97,7 +97,7 @@ export default function Page() {
9797

9898
### 客户端组件
9999

100-
无法在客户端组件中定义服务端函数。但可以通过从顶部带有 `"use server"` 指令的文件导入来调用它们
100+
无法在客户端组件中定义服务端函数。但您可以通过从顶部带有 `"use server"` 指令的文件导入它们,在客户端组件中调用这些函数
101101

102102
```ts filename="app/actions.ts" switcher
103103
'use server'
@@ -133,7 +133,7 @@ export function Button() {
133133

134134
## 调用服务端函数
135135

136-
主要有两种方式可以调用服务端函数
136+
有两种主要方式可以调用服务端函数
137137

138138
1. 服务端和客户端组件中的[表单](#forms)
139139
2. 客户端组件中的[事件处理程序](#event-handlers)
@@ -142,7 +142,7 @@ export function Button() {
142142

143143
React 扩展了 HTML [`<form>`](https://react.dev/reference/react-dom/components/form) 元素,允许通过 HTML `action` 属性调用服务端函数。
144144

145-
在表单中调用时,函数会自动接收 [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData/FormData) 对象。你可以使用原生 [`FormData` 方法](https://developer.mozilla.org/en-US/docs/Web/API/FormData#instance_methods)提取数据:
145+
在表单中调用时,函数会自动接收 [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData/FormData) 对象。您可以使用原生 [`FormData` 方法](https://developer.mozilla.org/en-US/docs/Web/API/FormData#instance_methods)提取数据:
146146

147147
```tsx filename="app/ui/form.tsx" switcher
148148
import { createPost } from '@/app/actions'
@@ -196,11 +196,11 @@ export async function createPost(formData) {
196196
}
197197
```
198198

199-
> **须知:** 当传递给 `action` 属性时,服务端函数也被称为*服务端操作 (Server Actions)*
199+
> **须知:** 当传递给 `action` 属性时,服务端函数也被称为_服务端操作 (Server Actions)_
200200
201201
### 事件处理程序
202202

203-
可以在客户端组件中使用 `onClick` 等事件处理程序调用服务端函数。
203+
您可以在客户端组件中使用 `onClick` 等事件处理程序调用服务端函数。
204204

205205
```tsx filename="app/like-button.tsx" switcher
206206
'use client'
@@ -254,22 +254,22 @@ export default function LikeButton({ initialLikes }) {
254254

255255
## 示例
256256

257-
### 显示待处理状态
257+
### 显示等待状态
258258

259-
在执行服务端函数时,可以使用 React 的 [`useActionState`](https://react.dev/reference/react/useActionState) 钩子显示加载指示器。该钩子会返回一个 `pending` 布尔值:
259+
在执行服务端函数时,您可以使用 React 的 [`useActionState`](https://react.dev/reference/react/useActionState) 钩子显示加载指示器。该钩子会返回一个 `pending` 布尔值:
260260

261261
```tsx filename="app/ui/button.tsx" switcher
262262
'use client'
263263

264-
import { useActionState } from 'react'
264+
import { useActionState, startTransition } from 'react'
265265
import { createPost } from '@/app/actions'
266266
import { LoadingSpinner } from '@/app/ui/loading-spinner'
267267

268268
export function Button() {
269269
const [state, action, pending] = useActionState(createPost, false)
270270

271271
return (
272-
<button onClick={async () => action()}>
272+
<button onClick={() => startTransition(action)}>
273273
{pending ? <LoadingSpinner /> : '创建文章'}
274274
</button>
275275
)
@@ -279,15 +279,15 @@ export function Button() {
279279
```jsx filename="app/ui/button.js" switcher
280280
'use client'
281281

282-
import { useActionState } from 'react'
282+
import { useActionState, startTransition } from 'react'
283283
import { createPost } from '@/app/actions'
284284
import { LoadingSpinner } from '@/app/ui/loading-spinner'
285285

286286
export function Button() {
287287
const [state, action, pending] = useActionState(createPost, false)
288288

289289
return (
290-
<button onClick={async () => action()}>
290+
<button onClick={() => startTransition(action)}>
291291
{pending ? <LoadingSpinner /> : '创建文章'}
292292
</button>
293293
)
@@ -296,7 +296,7 @@ export function Button() {
296296

297297
### 重新验证缓存
298298

299-
执行更新后,可以通过在服务端函数中调用 [`revalidatePath`](/docs/app/api-reference/functions/revalidatePath)[`revalidateTag`](/docs/app/api-reference/functions/revalidateTag) 来重新验证 Next.js 缓存并显示更新后的数据:
299+
执行更新后,您可以通过在服务端函数中调用 [`revalidatePath`](/docs/app/api-reference/functions/revalidatePath)[`revalidateTag`](/docs/app/api-reference/functions/revalidateTag) 来重新验证 Next.js 缓存并显示更新后的数据:
300300

301301
```ts filename="app/lib/actions.ts" switcher
302302
import { revalidatePath } from 'next/cache'
@@ -323,7 +323,7 @@ export async function createPost(formData) {
323323

324324
### 重定向
325325

326-
你可能希望在执行更新后将用户重定向到其他页面。可以通过在服务端函数中调用 [`redirect`](/docs/app/api-reference/functions/redirect) 实现
326+
您可能希望在执行更新后将用户重定向到其他页面。可以通过在服务端函数中调用 [`redirect`](/docs/app/api-reference/functions/redirect) 来实现
327327

328328
```ts filename="app/lib/actions.ts" switcher
329329
'use server'

0 commit comments

Comments
 (0)