React 入门

此页面是 React 文档和相关资源的概述。

React 是一个用于构建用户界面的 JavaScript 库。 在我们的主页教程中了解 React 的全部内容。


尝试 React

React 从一开始就被设计为逐步采用的方式,并且 您可以根据需要随心所欲的使用 React。无论你是想为简单的 HTML 页面添加一些交互性,而想尝试 React,或者启动一个复杂的 React 驱动的应用程序,本节中的链接将帮助您开始。

在线演练场

如果你对 React 有兴趣,并且想玩一下 React ,你可以使用在线代码演练场。试试 CodePenCodeSandbox 上的 Hello World 模板。

如果你更喜欢使用自己的文本编辑器,你也可以 下载这个HTML文件 ,编辑它,并从浏览器中的本地文件系统中打开它。它的运行时代码转换很慢,所以我们只建议使用这个简单的演示。

将 React 添加到网站

您可以 在一分钟内将 React 添加到HTML页面 。 然后,您可以逐渐扩展其存在,或将其包含到一些动态小部件(widgets)中。

创建一个新的 React 应用程序

在开始 React 项目时,简单的带有 script 标签的 HTML 页面 可能仍然是最佳选择。设置它只需要一分钟!

随着应用程序的增长,您可能需要考虑一个更集成的设置。我们建议大型应用程序使用 多个 JavaScript 工具链 。它们中的每一个都可以在几乎没有配置的情况下工作,并让您充分利用丰富的 React 生态系统。

学习 React

学习 React 的人来自不同技术背景和不同学习习惯。无论你喜欢更偏向理论性的学习,还是注重实际应用的学习,我们都希望您会发现这些部分对你来说非常有帮助。

  • 如果你喜欢通过实际应用来学习,请从我们的 实用教程 开始。
  • 如果您愿意逐步学习概念,请从我们的 [主要概念指南][guide to main concepts] 开始。

和任何不熟悉的技术一样,React 确实有一条学习曲线。通过多加练习和一些耐心,你 得到 React 的窍门。

第一个例子

React 主页 包含了一些带有实时编辑器的小型 React 示例。即使您对 React 一无所知,也请尝试更改其代码并查看它对结果的影响。

React 对于初学者

我们建议你先看看 Tania Rascia 对 React 的概述,它用对初学者友好的方式详细介绍了最重要的 React 概念。看完后,再来读一次文档吧!

提示

官方推荐的这篇 React 入门教程非常适合初学者,已有中文翻译:《React入门教程 – 概述和实际演练

React 对于设计师

如果您来自设计背景,这些资源是开始使用 React 的好地方。

JavaScript 资源

我们的 React 文档假定您已经熟悉用 JavaScript 语言的编程。你不必是专家,但同时学习 React 和 JavaScript 很难。

我们建议您浏览这些 JavaScript 概述 以检查您的知识水平。它会花费你30分钟到1小时,但你会对学习 React 更有信心。

提示

每当你对 JavaScript 中的某些东西感到困惑时,查阅 MDNjavascript.info 会对你非常有帮助。还有我们的 社区支持论坛 ),您可以在这里寻求帮助。

实用教程

如果你喜欢 边做边学,看看我们的 实用教程。在本教程中,我们用 React 中构建了一个井字游戏。你可能会试图跳过它,因为你不是为了制作游戏 — 但给它一个机会。您将在本教程中学到的技巧对于构建 任何 React 应用程序都非常重要,掌握它会给你更深的理解。

一步一步进阶

如果你喜欢 一步一步学习概念,我们的 主要概念指南 是最好的开始。每一章的知识内容都建立在前几章介绍基础上,所以你不会错过任何事情。

React 的编程思想

相信许多 React 用户阅读完 React 的编程思想 后的第一反应就是:终于找到了答案。这可能是对最古老的 React 走查(集中讨论代码的过程),但它仍然非常有必要阅读。

推荐课程

有时候人们发现第三方书籍和视频课程比官方文档更有帮助。 我们维护了一份 普通推荐的资源列表,其中一些是免费的。

高级概念

一旦你对 主要概念 部分感到满意并且已经使用 React 稍微玩一下,您可能对更高级的主题感兴趣。本节将向您介绍强大的,但不太常用的 React 功能,如 上下文 contextrefs

API参考

如果您想了解有关特定 React API 的更多详细信息,此文档部分非常有用。 例如,React.Component API参考 可以为您提供有关 setState() 工作方式的详细信息,以及不同的有用的生命周期方法的详细信息。

术语表和常见问题

术语表 包含了您在 React 文档中看到的最常见术语的概述。 还有一个常见问题部分,专门提供关于常见主题的简短问题和解答, 包括AJAX请求组件状态(state))和 文件结构

保持知情

React博客 是 React 团队更新信息的官方来源。 任何重要的,包括发行说明或弃用声明,都将首先在那里发布。

您还可以在 Twitter上关注 @reactjs 帐户,但是如果你只是阅读博客,你不会错过任何必要的东西。

并非每个 React 版本都会发布对于的博客文章,但是您可以在 React 仓库中的 CHANGELOG.md 文件 ,以及发布 页面上找到每个版本的详细更新日志。

各个版本文档

本文档始终反映了 React 的最新稳定版本。 自 React 16 以来,您可以在单独页面上找到旧版本的文档。 请注意,过去版本的文档在发布时会被快照,并且不会不断更新。

愚人码头注:React v16.2.0 中文文档

缺少文档?

愚人码头注:中文文档相对翻译进度落后于官方文档,如果没有及时同步翻译,请在微博上 @愚人码头

如果文档中缺少某些内容,或者您​​发现某些部分有混淆,请 针对文档存储库提出问题 并提出您的改进建议,或通过 @reactjs 帐户 发送推文。我们喜欢听到你的声音!