这是我参与「第五届青训营 」笔记创作活动的第4天
react是什么？
React用于构建用户界面的JS库。是一个将数据渲染为HTML视图的开源JS库。
为什么学？
- 原生JS操作DOM繁琐，效率低
- 使用JS直接操作DOM,浏览器会进行大量的重绘重排
- 原生JS没有组件化编码方案，代码复用低
React入门
React 基础案例
- 先倒入三个包
- 创建一个容器
- 创建虚拟DOM，渲染到容器中
这样，就会在页面中的这个div容器上添加这个h1
JSX基础语法
两种创建虚拟DOM的方式
- 使用JSX创建虚拟DOM
- 使用JS创建虚拟DOM
jsx语法规则
- 定义虚拟DOM，不能使用“”
- 标签中混入JS表达式的时候使用{}
- 样式的类名指定不要使用class，使用className
- 内敛样式要使用双大括号包裹
- 不能有多个根标签，只能有一个跟标签
- 标签必须闭合
- 如果小写字母开头，就将标签转化为html同名元素，如果html中无该标签对应的元素，就报错；如果是大写字母开头，react就去渲染对应的组件，如果没有就报错
模块与组件、模块化与组件化的理解
模块
理解：向外提供特定功能的js程序, 一般就是一个js文件
为什么要拆成模块：随着业务逻辑增加，代码越来越多且复杂。 作用：复用js, 简化js的编写, 提高js运行效率
组件
理解：用来实现局部功能效果的代码和资源的集合(html/css/js/image等等) 为什么要用组件： 一个界面的功能更复杂 作用：复用编码, 简化项目编码, 提高运行效率
模块化
当应用的js都以模块来编写的, 这个应用就是一个模块化的应用
组件化
当应用是以多组件的方式实现, 这个应用就是一个组件化的应用
