React 入门指南

1. 什么是React？

React是一个用于构建用户界面的JavaScript库。它允许你构建复杂的用户界面，并通过组件化的方式进行管理。

2. React 的核心概念

• 组件: React应用程序由多个独立的组件组成。每个组件都有自己的状态和行为，并可以渲染自己的UI。
• JSX: JSX是一种语法扩展，允许你在JavaScript代码中嵌入HTML。
• 虚拟DOM: React使用虚拟DOM来跟踪UI的更改，并在必要时高效地更新真实DOM。
• 状态管理: React使用状态来管理组件的变化，并通过setState方法进行更新。
• Props: Props是组件之间传递数据的机制，类似于函数参数。

3. 安装 React

bash npm install react react-dom

4. 创建一个 React 组件

```javascript import React from 'react';

function MyComponent() { return (

export default MyComponent; ```

5. 渲染组件

```javascript import React from 'react'; import ReactDOM from 'react-dom/client'; import MyComponent from './MyComponent';

const root = ReactDOM.createRoot(document.getElementById('root')); root.render(); ```

6. 使用 props 传递数据

```javascript import React from 'react';

function Greeting(props) { return (

export default Greeting; ```

7. 管理组件状态

```javascript import React, { useState } from 'react';

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

const handleClick = () => { setCount(count + 1); };

return (

export default Counter; ```

8. 总结

本文档介绍了 React 的基本概念和使用方法。你可以通过学习更多关于 React 的知识，构建更复杂和功能丰富的应用程序。

9. 进一步学习

• React 官方文档
• React 教程
• React 学习资源