本章主要学习：
开发环境与核心概念
1.React思想与前端演进；
2.使用vite搭建React+TypeScript开发环境；
3.深入JS语法与实践技巧；
4.函数式组件与Class组件对比
组件化开发核心
1.Prpos与组件通讯
2.使用TypeScript定义Props类型（PropsWithChildren）
3.事件处理与合成事件系统
4.状态管理入门：useState Hook详解
5.条件渲染与列表渲染（key的重要性）
深入Hooks与生命周期
1.副作用处理：useEffect Hook详解（挂载、更新、卸载）
2.useEffect的依赖项数组与常见陷阱
3.使用useRef访问DOM和存储可变值
4.TypeScript与Hooks的类型推断与显式声明
1.使用vite搭建React+TypeScript
创建项目的命令
npm create vite@latest
启动开发服务器
npm run dev / pnpm dev
结果：
2. JSX语法
用的最多的就是函数式组件
import React from 'react';
function Test(){
return <div>Test</div>
}
export default Test;
而以下的对象式组件则更符合面向对象思想，较为冗杂
import React from 'react';
class Test extends React.Component {
render() {
return (
<div>Test
</div>
);
}
}
export default Test;
2.1 使用函数式组件进行状态视图解耦
意思是初始值为0，变量为count 方法名为setCount
import React, {useState} from 'react';
import './App.css'
function App() {
const [count, setCount] = useState(0);
return <div onClick={() => setCount(count + 1)}>{count}</div>
}
export default App;
