community/tutorials/react-documentation

React 是一个用于构建用户界面的 JavaScript 库。以下是一些关于 React 的基础教程。

React 简介

React 是由 Facebook 开发的一个用于构建用户界面的 JavaScript 库。它允许开发者构建快速、可维护的用户界面。

• React 官方文档
• React 快速开始

React 特性

• 组件化：React 的核心思想是组件化，可以将 UI 分解为可复用的组件。
• 虚拟 DOM：React 使用虚拟 DOM 来提高性能，减少不必要的 DOM 操作。
• 单向数据流：React 使用单向数据流来管理状态，使得状态管理更加简单。

入门教程

1. 创建第一个 React 应用
   • 首先，你需要安装 Node.js 和 npm。
   • 然后，使用 create-react-app 命令来创建一个新的 React 应用。

npx create-react-app my-app

2. 编写 React 组件

   • React 组件可以是函数或类。
   • 函数组件更简单，适合简单的 UI。
   • 类组件更强大，适合复杂的 UI。

3. 管理状态

   • 使用 useState 钩子来管理组件的状态。
   • 使用 useEffect 钩子来处理副作用，如 API 调用。

import React, { useState, useEffect } from 'react';

function MyComponent() {
  const [count, setCount] = useState(0);

  useEffect(() => {
    // API 调用或其他副作用
  }, []);

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={() => setCount(count + 1)}>Increment</button>
    </div>
  );
}

扩展阅读

• React Hooks
• React Router

React Logo