Skip to content

Commit ac5a16c

Browse files
docschina-botdocschina-bot
committed
docs(en): merging all conflicts
2 parents 8bffb46 + 01edd5c commit ac5a16c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+2687
-77
lines changed

‎.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,3 +36,6 @@ yarn-error.log*
3636

3737
# external fonts
3838
public/fonts/**/Optimistic_*.woff2
39+
40+
# rss
41+
public/rss.xml

‎package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,12 @@
1515
"prettier:diff": "yarn nit:source",
1616
"lint-heading-ids": "node scripts/headingIdLinter.js",
1717
"fix-headings": "node scripts/headingIdLinter.js --fix",
18-
"ci-check": "npm-run-all prettier:diff --parallel lint tsc lint-heading-ids",
18+
"ci-check": "npm-run-all prettier:diff --parallel lint tsc lint-heading-ids rss",
1919
"tsc": "tsc --noEmit",
2020
"start": "next start",
2121
"postinstall": "patch-package && (is-ci || husky install .husky)",
22-
"check-all": "npm-run-all prettier lint:fix tsc"
22+
"check-all": "npm-run-all prettier lint:fix tsc rss",
23+
"rss": "node scripts/generateRss.js"
2324
},
2425
"dependencies": {
2526
"@codesandbox/sandpack-react": "2.13.5",

‎public/images/team/lauren.jpg

28.1 KB
Loading

‎scripts/generateRss.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/*
2+
* Copyright (c) Facebook, Inc. and its affiliates.
3+
*/
4+
const {generateRssFeed} = require('../src/utils/rss');
5+
6+
generateRssFeed();

‎src/components/Layout/Page.tsx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import type {RouteItem} from 'components/Layout/getRouteMeta';
2121
import {HomeContent} from './HomeContent';
2222
import {TopNav} from './TopNav';
2323
import cn from 'classnames';
24+
import Head from 'next/head';
2425

2526
import(/* webpackPrefetch: true */ '../MDX/CodeBlock/CodeBlock');
2627

@@ -117,7 +118,21 @@ export function Page({children, toc, routeTree, meta, section}: PageProps) {
117118
image={`/images/og-` + section + '.png'}
118119
searchOrder={searchOrder}
119120
/>
121+
<<<<<<< HEAD
120122
{/* <SocialBanner /> */}
123+
=======
124+
{(isHomePage || isBlogIndex) && (
125+
<Head>
126+
<link
127+
rel="alternate"
128+
type="application/rss+xml"
129+
title="React Blog RSS Feed"
130+
href="/rss.xml"
131+
/>
132+
</Head>
133+
)}
134+
<SocialBanner />
135+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
121136
<TopNav
122137
section={section}
123138
routeTree={routeTree}

‎src/components/MDX/ConsoleBlock.tsx

Lines changed: 78 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,10 @@ interface ConsoleBlockProps {
1515
children: React.ReactNode;
1616
}
1717

18+
interface ConsoleBlockMultiProps {
19+
children: React.ReactNode;
20+
}
21+
1822
const Box = ({
1923
width = '60px',
2024
height = '17px',
@@ -29,7 +33,7 @@ const Box = ({
2933
<div className={className} style={{width, height, ...customStyles}}></div>
3034
);
3135

32-
function ConsoleBlock({level = 'error', children}: ConsoleBlockProps) {
36+
export function ConsoleBlock({level = 'error', children}: ConsoleBlockProps) {
3337
let message: React.ReactNode | null;
3438
if (typeof children === 'string') {
3539
message = children;
@@ -38,7 +42,10 @@ function ConsoleBlock({level = 'error', children}: ConsoleBlockProps) {
3842
}
3943

4044
return (
41-
<div className="mb-4 text-secondary" translate="no" dir="ltr">
45+
<div
46+
className="console-block mb-4 text-secondary bg-wash dark:bg-wash-dark rounded-lg"
47+
translate="no"
48+
dir="ltr">
4249
<div className="flex w-full rounded-t-lg bg-gray-200 dark:bg-gray-80">
4350
<div className="px-4 py-2 border-gray-300 dark:border-gray-90 border-r">
4451
<Box className="bg-gray-300 dark:bg-gray-70" width="15px" />
@@ -73,4 +80,72 @@ function ConsoleBlock({level = 'error', children}: ConsoleBlockProps) {
7380
);
7481
}
7582

76-
export default ConsoleBlock;
83+
export function ConsoleBlockMulti({children}: ConsoleBlockMultiProps) {
84+
return (
85+
<div
86+
className="console-block mb-4 text-secondary bg-wash dark:bg-wash-dark rounded-lg"
87+
translate="no"
88+
dir="ltr">
89+
<div className="flex w-full rounded-t-lg bg-gray-200 dark:bg-gray-80">
90+
<div className="px-4 py-2 border-gray-300 dark:border-gray-90 border-r">
91+
<Box className="bg-gray-300 dark:bg-gray-70" width="15px" />
92+
</div>
93+
<div className="flex text-sm px-4">
94+
<div className="border-b-2 border-gray-300 dark:border-gray-90 text-tertiary dark:text-tertiary-dark">
95+
Console
96+
</div>
97+
<div className="px-4 py-2 flex">
98+
<Box className="me-2 bg-gray-300 dark:bg-gray-70" />
99+
<Box className="me-2 hidden md:block bg-gray-300 dark:bg-gray-70" />
100+
<Box className="hidden md:block bg-gray-300 dark:bg-gray-70" />
101+
</div>
102+
</div>
103+
</div>
104+
<div className="grid grid-cols-1 divide-y divide-gray-300 dark:divide-gray-70 text-base">
105+
{children}
106+
</div>
107+
</div>
108+
);
109+
}
110+
111+
export function ConsoleLogLine({children, level}: ConsoleBlockProps) {
112+
let message: React.ReactNode | null;
113+
if (typeof children === 'string') {
114+
message = children;
115+
} else if (isValidElement(children)) {
116+
message = children.props.children;
117+
} else if (Array.isArray(children)) {
118+
message = children.reduce((result, child) => {
119+
if (typeof child === 'string') {
120+
result += child;
121+
} else if (isValidElement(child)) {
122+
// @ts-ignore
123+
result += child.props.children;
124+
}
125+
return result;
126+
}, '');
127+
}
128+
129+
return (
130+
<div
131+
className={cn(
132+
'ps-4 pe-2 pt-1 pb-2 grid grid-cols-[18px_auto] font-mono rounded-b-md',
133+
{
134+
'bg-red-30 text-red-50 dark:text-red-30 bg-opacity-5':
135+
level === 'error',
136+
'bg-yellow-5 text-yellow-50': level === 'warning',
137+
'bg-gray-5 text-secondary dark:text-secondary-dark': level === 'info',
138+
}
139+
)}>
140+
{level === 'error' && (
141+
<IconError className="self-start mt-1.5 text-[.7rem] w-6" />
142+
)}
143+
{level === 'warning' && (
144+
<IconWarning className="self-start mt-1 text-[.65rem] w-6" />
145+
)}
146+
<div className="px-2 pt-1 whitespace-break-spaces text-code leading-tight">
147+
{message}
148+
</div>
149+
</div>
150+
);
151+
}

‎src/components/MDX/MDXComponents.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import cn from 'classnames';
88

99
import CodeBlock from './CodeBlock';
1010
import {CodeDiagram} from './CodeDiagram';
11-
import ConsoleBlock from './ConsoleBlock';
11+
import {ConsoleBlock, ConsoleLogLine, ConsoleBlockMulti} from './ConsoleBlock';
1212
import ExpandableCallout from './ExpandableCallout';
1313
import ExpandableExample from './ExpandableExample';
1414
import {H1, H2, H3, H4, H5} from './Heading';
@@ -420,6 +420,8 @@ export const MDXComponents = {
420420
pre: CodeBlock,
421421
CodeDiagram,
422422
ConsoleBlock,
423+
ConsoleBlockMulti,
424+
ConsoleLogLine,
423425
DeepDive: (props: {
424426
children: React.ReactNode;
425427
title: string;

‎src/content/blog/2020/12/21/data-fetching-with-react-server-components.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "介绍零打包大小的 React 服务器组件"
4+
=======
5+
title: "Introducing Zero-Bundle-Size React Server Components"
6+
author: Dan Abramov, Lauren Tan, Joseph Savona, and Sebastian Markbage
7+
date: 2020/12/21
8+
description: 2020 has been a long year. As it comes to an end we wanted to share a special Holiday Update on our research into zero-bundle-size React Server Components.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2020 年 12 月 21 日 [Dan Abramov](https://twitter.com/dan_abramov)、[Lauren Tan](https://twitter.com/potetotes)、[Joseph Savona](https://twitter.com/en_JS) 与 [Sebastian Markbåge](https://twitter.com/sebmarkbage)

‎src/content/blog/2021/06/08/the-plan-for-react-18.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "React 18 发布计划"
4+
=======
5+
title: "The Plan for React 18"
6+
author: Andrew Clark, Brian Vaughn, Christine Abernathy, Dan Abramov, Rachel Nabors, Rick Hanlon, Sebastian Markbage, and Seth Webster
7+
date: 2021/06/08
8+
description: The React team is excited to share a few updates. We’ve started work on the React 18 release, which will be our next major version. We’ve created a Working Group to prepare the community for gradual adoption of new features in React 18. We’ve published a React 18 Alpha so that library authors can try it and provide feedback...
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2021 年 7 月 8 日 [Andrew Clark](https://twitter.com/acdlite)、[Brian Vaughn](https://github.com/bvaughn)、[Christine Abernathy](https://twitter.com/abernathyca)、[Dan Abramov](https://twitter.com/dan_abramov)、[Rachel Nabors](https://twitter.com/rachelnabors)、[Rick Hanlon](https://twitter.com/rickhanlonii)、[Sebastian Markbåge](https://twitter.com/sebmarkbage) 与 [Seth Webster](https://twitter.com/sethwebster)

‎src/content/blog/2021/12/17/react-conf-2021-recap.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "回顾 React Conf 2021"
4+
=======
5+
title: "React Conf 2021 Recap"
6+
author: Jesslyn Tannady and Rick Hanlon
7+
date: 2021/12/17
8+
description: Last week we hosted our 6th React Conf. In previous years, we've used the React Conf stage to deliver industry changing announcements such as React Native and React Hooks. This year, we shared our multi-platform vision for React, starting with the release of React 18 and gradual adoption of concurrent features.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2021 年 12 月 17 日 [Jesslyn Tannady](https://twitter.com/jtannady) 与 [Rick Hanlon](https://twitter.com/rickhanlonii)

‎src/content/blog/2022/03/08/react-18-upgrade-guide.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "如何升级到 React 18"
4+
=======
5+
title: "How to Upgrade to React 18"
6+
author: Rick Hanlon
7+
date: 2022/03/08
8+
description: As we shared in the release post, React 18 introduces features powered by our new concurrent renderer, with a gradual adoption strategy for existing applications. In this post, we will guide you through the steps for upgrading to React 18.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2022 年 8 月 3 日 [Rick Hanlon](https://twitter.com/rickhanlonii)

‎src/content/blog/2022/03/29/react-v18.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
---
22
title: "React v18.0"
3+
author: The React Team
4+
date: 2022/03/08
5+
description: React 18 is now available on npm! In our last post, we shared step-by-step instructions for upgrading your app to React 18. In this post, we'll give an overview of what's new in React 18, and what it means for the future.
36
---
47

58
2022 年 3 月 29 日，由 [React 团队](/community/team) 发布

‎src/content/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "React Labs：我们正在努力的方向——2022 年 6 月"
4+
=======
5+
title: "React Labs: What We've Been Working On – June 2022"
6+
author: Andrew Clark, Dan Abramov, Jan Kassens, Joseph Savona, Josh Story, Lauren Tan, Luna Ruan, Mengdi Chen, Rick Hanlon, Robert Zhang, Sathya Gunasekaran, Sebastian Markbage, and Xuan Huang
7+
date: 2022/06/15
8+
description: React 18 was years in the making, and with it brought valuable lessons for the React team. Its release was the result of many years of research and exploring many paths. Some of those paths were successful; many more were dead-ends that led to new insights. One lesson we’ve learned is that it’s frustrating for the community to wait for new features without having insight into these paths that we’re exploring.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2022 年 6 月 15 日 [Andrew Clark](https://twitter.com/acdlite)、[Dan Abramov](https://twitter.com/dan_abramov)、[Jan Kassens](https://twitter.com/kassens)、[Joseph Savona](https://twitter.com/en_JS)、[Josh Story](https://twitter.com/joshcstory)、[Lauren Tan](https://twitter.com/potetotes)、[Luna Ruan](https://twitter.com/lunaruan)、[Mengdi Chen](https://twitter.com/mengdi_en)、[Rick Hanlon](https://twitter.com/rickhanlonii)、[Robert Zhang](https://twitter.com/jiaxuanzhang01)、[Sathya Gunasekaran](https://twitter.com/_gsathya)、[Sebastian Markbåge](https://twitter.com/sebmarkbage) 与 [Xuan Huang](https://twitter.com/Huxpro)

‎src/content/blog/2023/03/16/introducing-react-dev.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "介绍 react.dev"
4+
=======
5+
title: "Introducing react.dev"
6+
author: Dan Abramov and Rachel Nabors
7+
date: 2023/03/16
8+
description: Today we are thrilled to launch react.dev, the new home for React and its documentation. In this post, we would like to give you a tour of the new site.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2023 年 3 月 16 日 [Dan Abramov](https://twitter.com/dan_abramov) 与 [Rachel Nabors](https://twitter.com/rachelnabors)

‎src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "React Labs：我们正在努力的方向——2023 年 3 月"
4+
=======
5+
title: "React Labs: What We've Been Working On – March 2023"
6+
author: Joseph Savona, Josh Story, Lauren Tan, Mengdi Chen, Samuel Susla, Sathya Gunasekaran, Sebastian Markbage, and Andrew Clark
7+
date: 2023/03/22
8+
description: In React Labs posts, we write about projects in active research and development. We've made significant progress on them since our last update, and we'd like to share what we learned.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2023 年 3 月 22 日 [Joseph Savona](https://twitter.com/en_JS)、[Josh Story](https://twitter.com/joshcstory)、[Lauren Tan](https://twitter.com/potetotes)、[Mengdi Chen](https://twitter.com/mengdi_en)、[Samuel Susla](https://twitter.com/SamuelSusla)、[Sathya Gunasekaran](https://twitter.com/_gsathya)、[Sebastian Markbåge](https://twitter.com/sebmarkbage) 与 [Andrew Clark](https://twitter.com/acdlite)

‎src/content/blog/2023/05/03/react-canaries.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "React Canaries：在 Meta 之外逐步推出新功能"
4+
=======
5+
title: "React Canaries: Enabling Incremental Feature Rollout Outside Meta"
6+
author: Dan Abramov, Sophie Alpert, Rick Hanlon, Sebastian Markbage, and Andrew Clark
7+
date: 2023/05/03
8+
description: We'd like to offer the React community an option to adopt individual new features as soon as their design is close to final, before they're released in a stable version--similar to how Meta has long used bleeding-edge versions of React internally. We are introducing a new officially supported [Canary release channel](/community/versioning-policy#canary-channel). It lets curated setups like frameworks decouple adoption of individual React features from the React release schedule.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2023 年 5 月 3 日 [Dan Abramov](https://twitter.com/dan_abramov)、[Sophie Alpert](https://twitter.com/sophiebits)、[Rick Hanlon](https://twitter.com/rickhanlonii)、[Sebastian Markbåge](https://twitter.com/sebmarkbage) 与 [Andrew Clark](https://twitter.com/acdlite)

‎src/content/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
---
2+
<<<<<<< HEAD
23
title: "React Labs：我们正在努力的方向——2024 年 2 月"
4+
=======
5+
title: "React Labs: What We've Been Working On – February 2024"
6+
author: Joseph Savona, Ricky Hanlon, Andrew Clark, Matt Carroll, and Dan Abramov
7+
date: 2024/02/15
8+
description: In React Labs posts, we write about projects in active research and development. We’ve made significant progress since our last update, and we’d like to share our progress.
9+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
310
---
411

512
2024 年 2 月 15 日 [Joseph Savona](https://twitter.com/en_JS)、[Ricky Hanlon](https://twitter.com/rickhanlonii)、[Andrew Clark](https://twitter.com/acdlite)、[Matt Carroll](https://twitter.com/mattcarrollcode) 与 [Dan Abramov](https://twitter.com/dan_abramov)
@@ -52,7 +59,11 @@ JavaScript 是一个因其松散规则和动态特性而闻名的具有挑战性
5259
</form>
5360
```
5461

62+
<<<<<<< HEAD
5563
`action` 函数可以同步或异步执行。你可以在客户端使用标准 JavaScript 定义它们，也可以在服务器上使用 [`'use server'`](/reference/react/use-server) 指示符。当使用 action 时，React 将帮助管理数据提交的生命周期，提供类似 [`useFormStatus`](/reference/react-dom/hooks/useFormStatus) 和 [`useFormState`](/reference/react-dom/hooks/useFormState) 的 Hook，以访问表单操作的当前 state 与响应。
64+
=======
65+
The `action` function can operate synchronously or asynchronously. You can define them on the client side using standard JavaScript or on the server with the [`'use server'`](/reference/rsc/use-server) directive. When using an action, React will manage the life cycle of the data submission for you, providing hooks like [`useFormStatus`](/reference/react-dom/hooks/useFormStatus), and [`useActionState`](/reference/react/useActionState) to access the current state and response of the form action.
66+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
5667
5768
默认情况下，Action 在 [transition](/reference/react/useTransition) 中提交，使当前页面在操作处理过程中保持交互性。由于 Action 支持异步函数，我们还添加了在 transitions 中使用 `async/await` 的功能，这允许在异步请求（如 `fetch`）开始时使用转换的 `isPending` 状态显示待处理 UI，并在应用更新时始终显示待处理 UI。
5869

@@ -72,13 +83,21 @@ Canaries 是我们开发 React 的一种变化。以前，功能会在 Meta 内
7283

7384
React 服务器组件、资源加载、文档元数据与 Action 都已经加入了 React Canary，并且我们已经在 react.dev 上为这些功能添加了文档：
7485

86+
<<<<<<< HEAD
7587
- **指示符**：[`"use client"`](/reference/react/use-client) 与 [`"use server"`](/reference/react/use-server) 是设计用于全栈 React 框架的打包功能。它们标记了两个环境之间的“分割点”：use client 指示符指示打包工具生成一个 `<script>` 标签（类似于 [Astro Islands](https://docs.astro.build/en/concepts/islands/#creating-an-island)），而 use server 告诉打包工具生成一个 POST 端点（类似于 [tRPC Mutations](https://trpc.io/docs/concepts)）。它们让你可以编写将客户端交互性与相关的服务器端逻辑组合在一起的可重用组件。
88+
=======
89+
- **Directives**: [`"use client"`](/reference/rsc/use-client) and [`"use server"`](/reference/rsc/use-server) are bundler features designed for full-stack React frameworks. They mark the "split points" between the two environments: `"use client"` instructs the bundler to generate a `<script>` tag (like [Astro Islands](https://docs.astro.build/en/concepts/islands/#creating-an-island)), while `"use server"` tells the bundler to generate a POST endpoint (like [tRPC Mutations](https://trpc.io/docs/concepts)). Together, they let you write reusable components that compose client-side interactivity with the related server-side logic.
90+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
7691
7792
- **文档元数据**：我们内置支持在组件树中的任何位置渲染 [`<title>`](/reference/react-dom/components/title)、[`<meta>`](/reference/react-dom/components/meta) 和元数据 [`<link>`](/reference/react-dom/components/link) 标签。这些在所有环境中都以相同的方式工作，包括完全客户端代码、SSR 和 RSC。这为像 [React Helmet](https://github.com/nfl/react-helmet) 这样的库开创的功能提供了内置支持。
7893

7994
- **资源加载**：我们将 Suspense 与样式表、字体和脚本等资源的加载生命周期集成在一起，以便 React 考虑它们来确定像 [`<style>`](/reference/react-dom/components/style)、[`<link>`](/reference/react-dom/components/link) 和 [`<script>`](/reference/react-dom/components/script) 这样的元素中的内容是否已准备就绪。我们还添加了新的 [资源加载 API](/reference/react-dom#resource-preloading-apis)，如 `preload` 和 `preinit`，以提供更大的控制权，指示何时应加载和初始化资源。
8095

96+
<<<<<<< HEAD
8197
- **Action**：如上所述，我们已将 Action 添加到管理从客户端发送数据到服务器的功能中。现在可以将 `action` 添加到像 [`<form/>`](/reference/react-dom/components/form) 这样的元素中，使用 [`useFormStatus`](/reference/react-dom/hooks/useFormStatus) 访问状态，使用 [`useFormState`](/reference/react-dom/hooks/useFormState) 处理结果，并使用 [`useOptimistic`](/reference/react/useOptimistic) 乐观地更新 UI。
98+
=======
99+
- **Actions**: As shared above, we've added Actions to manage sending data from the client to the server. You can add `action` to elements like [`<form/>`](/reference/react-dom/components/form), access the status with [`useFormStatus`](/reference/react-dom/hooks/useFormStatus), handle the result with [`useActionState`](/reference/react/useActionState), and optimistically update the UI with [`useOptimistic`](/reference/react/useOptimistic).
100+
>>>>>>> 01edd5c1070c2c563f86ee508cff3e8cca6a36c3
82101
83102
由于所有这些功能是相互配合的，因此单独在稳定渠道中发布它们是困难的。发布 Action 而不带有用于访问表单状态的补充 Hook 会限制 Action 的实际可用性。引入 React 服务器组件而不集成 Server Action 会把在服务器上修改数据变得复杂化。
84103

0 commit comments

Comments
 (0)