react

495 阅读1分钟

www.bilibili.com/video/BV1Zm…

1、概念:React由Meta公司研发,是一个用于 构建Web和原生交互界面的库。

2、create-react-app是一个快速 创建React开发环境的工具,底层由Webpack构建,封装了配置细节。 npx create-react-app react-basic (1.npx Node.js工具命令,查找并执行后续的包命令 (2. create-react-app 核心包(固定写法),用于创建React项目 (3. react-basic React项目的名称(可以自定义)

3、JSX是JavaScript和XML(HTML)的缩写,表示在JS代码中编写HTML模版结构,它是React中编写UI模版的方式。

4、JSX中使用JS表达式: 在JSX中可以通过大括号语法{}识别Javascript中的表达式。

5、列表渲染:

34581F66185C22E8E23EC3E1B20785BA.png

6、条件渲染:在React中,可以通过逻辑与运算符&&、三元表达式(?:)实现基础的条件渲染。

7、useState 是一个 React Hook(函数),它允许我们向组件添加一个状态变量,从而控制影响组件的渲染结果。本质:和普通js变量不同的是,状态变量一旦发生变化组件的视图UI也会跟着变化(数据驱动视图)。

8、修改状态规则?

66F3F8DA4C17F8BEA275F4238F0C342A.png 9、React中获取DOM?

94665628763A9C90B0B5740D3B1D804B.png 10、组件通信?

11、Redux:React最常用的集中状态管理工具,类似于Vue中的Pinia(Vuex),可以独立于框架运行(作用:通过集中管理的方式管理应用的状态)。

12、Redux和React-环境准备:

38EE8EB021F6DA25A6C6D7634D69B48B.png 13、实现counter?