React 是一个用于构建用户界面的 JavaScript 库，由 Facebook 开发并维护。它可以帮助你构建快速、可交互的网页和移动应用。

快速开始

  1. 环境准备

    • 安装 Node.js 和 npm（Node.js 包管理器）。
    • 使用 create-react-app 快速搭建项目。

  2. 创建项目

    npx create-react-app my-react-app
cd my-react-app

  3. 运行项目

    npm start

  4. 编写代码

    • 在 src/App.js 中编写你的 React 组件。

组件

React 中的组件是构成用户界面的基本单元。组件可以是函数式或类组件。

函数式组件

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

ReactDOM.render(
  <Welcome name="Alice" />,
  document.getElementById('root')
);

类组件

class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

ReactDOM.render(
  <Welcome name="Bob" />,
  document.getElementById('root')
);

JSX

JSX 是一种 JavaScript 的语法扩展，用于描述用户界面。它看起来像 HTML，但可以包含 JavaScript 表达式。

const element = <h1>Hello, world!</h1>;

高阶组件（HOC）

高阶组件是接受组件作为参数并返回一个新的组件的函数。

function withSubscription(WrappedComponent, selectData) {
  // ...返回一个新的组件
}

路由

React Router 是一个用于在 React 应用中添加路由功能的库。

import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

<Router>
  <Switch>
    <Route path="/about" component={About} />
    <Route path="/contact" component={Contact} />
    <Route path="/" component={Home} />
  </Switch>
</Router>

资源

更多关于 React 的信息，请访问我们的 React 官方文档。

[center][Golden_Retriever]