Merge branch 'main' into translate-reference-index

Author: thehelium

README.md

@@ -148,4 +148,4 @@ The documentation is divided into several sections with a different tone and pur
 If you are interested in translating `react.dev`, please see the current translation efforts [here](https://github.com/reactjs/react.dev/issues/4135).
 
 ## License
-Content submitted to [react.dev](https://react.dev/) is CC-BY-4.0 licensed, as found in the [LICENSE-DOCS.md](https://github.com/reactjs/react.dev/blob/master/LICENSE-DOCS.md) file.
+Content submitted to [react.dev](https://react.dev/) is CC-BY-4.0 licensed, as found in the [LICENSE-DOCS.md](https://github.com/reactjs/react.dev/blob/main/LICENSE-DOCS.md) file.

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

@@ -89,7 +89,7 @@ Since our last update, we've tested an experimental version of prerendering inte
 
 ## Transition Tracing {/*transition-tracing*/}
 
-The Transition Tracing API lets you detect when [React Transitions](/reference/react/useTransition) become slower and to investigate why they may be slow. Following our last update, we have completed the initial design of the API and published an [RFC](https://github.com/reactjs/rfcs/pull/238). The basic capabilities have also been implemented. The project is currently on hold. We welcome feedback on the RFC and look forward to resuming its development to provide a better performance measurement tool for React. This will be particularly useful with routers built on top of React Transitions, like the [Next.js App Router](/learn/start-a-new-react-project#nextjs-app-router).
+The Transition Tracing API lets you detect when [React Transitions](/reference/react/useTransition) become slower and investigate why they may be slow. Following our last update, we have completed the initial design of the API and published an [RFC](https://github.com/reactjs/rfcs/pull/238). The basic capabilities have also been implemented. The project is currently on hold. We welcome feedback on the RFC and look forward to resuming its development to provide a better performance measurement tool for React. This will be particularly useful with routers built on top of React Transitions, like the [Next.js App Router](/learn/start-a-new-react-project#nextjs-app-router).
 
 * * *
 In addition to this update, our team has made recent guest appearances on community podcasts and livestreams to speak more on our work and answer questions.

src/content/learn/passing-data-deeply-with-context.md

@@ -339,7 +339,7 @@ export default function Heading({ children }) {
 }
 ```
 
-`useContext` 是一个 Hook。和 `useState` 以及 `useReducer`一样，你只能在 React 组件的顶层调用 Hook。**`useContext` 告诉 React `Heading` 组件想要读取 `LevelContext`。**
+`useContext` 是一个 Hook。和 `useState` 以及 `useReducer`一样，你只能在 React 组件中（不是循环或者条件里）立即调用 Hook。**`useContext` 告诉 React `Heading` 组件想要读取 `LevelContext`。**
 
 现在 `Heading` 组件没有 `level` 参数，你不需要再像这样在你的 JSX 中将 level 参数传递给 `Heading`：
 

src/content/learn/rendering-lists.md

@@ -1274,7 +1274,7 @@ hr {
 <Sandpack>
 
 ```js
-import React, { Fragment } from 'react';
+import { Fragment } from 'react';
 
 const poem = {
   lines: [

src/content/learn/start-a-new-react-project.md

@@ -86,7 +86,7 @@ If you're still not convinced, or your app has unusual constraints not served we
 
 ## Bleeding-edge React frameworks {/*bleeding-edge-react-frameworks*/}
 
-As we've explored how to continue improving React, we realized that integrating React more closely with frameworks (specifically, with routing, bundling, and server technologies) is our biggest opportunity to help React users build better apps. The Next.js team has agreed to collaborate with us in researching, developing, integrating, and testing framework-agnostic bleeding-edge React features like [React Server Components.](/blog/2020/12/21/data-fetching-with-react-server-components)
+As we've explored how to continue improving React, we realized that integrating React more closely with frameworks (specifically, with routing, bundling, and server technologies) is our biggest opportunity to help React users build better apps. The Next.js team has agreed to collaborate with us in researching, developing, integrating, and testing framework-agnostic bleeding-edge React features like [React Server Components.](/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components)
 
 These features are getting closer to being production-ready every day, and we've been in talks with other bundler and framework developers about integrating them. Our hope is that in a year or two, all frameworks listed on this page will have full support for these features. (If you're a framework author interested in partnering with us to experiment with these features, please let us know!)
 

src/content/learn/tutorial-tic-tac-toe.md

@@ -2903,10 +2903,10 @@ body {
 
 If you have extra time or want to practice your new React skills, here are some ideas for improvements that you could make to the tic-tac-toe game, listed in order of increasing difficulty:
 
-1. For the current move only, show "You are at move #..." instead of a button
+1. For the current move only, show "You are at move #..." instead of a button.
 1. Rewrite `Board` to use two loops to make the squares instead of hardcoding them.
 1. Add a toggle button that lets you sort the moves in either ascending or descending order.
 1. When someone wins, highlight the three squares that caused the win (and when no one wins, display a message about the result being a draw).
-1. Display the location for each move in the format (col, row) in the move history list.
+1. Display the location for each move in the format (row, col) in the move history list.
 
 Throughout this tutorial, you've touched on React concepts including elements, components, props, and state. Now that you've seen how these concepts work when building a game, check out [Thinking in React](/learn/thinking-in-react) to see how the same React concepts work when build an app's UI.

src/content/reference/react/useEffect.md

@@ -1382,7 +1382,7 @@ export default function App() {
         </button>
       </label>
       {show && <hr />}
-      {show && <ChatRoom />}
+      {show && <ChatRoom roomId={roomId}/>}
     </>
   );
 }