react入门

React特点

1. 声明式的设计
2. 高效，采用虚拟DOM实现DOM的渲染，最大限度的减少DOM的操作
3. 灵活，可以跟其他的库灵活搭配使用
4. JSX（语法糖），俗称在JS里面写HTML，JavaScript语法的扩展
5. 组件化，模块化，代码容易复用，16年之前大型项目很喜欢react，现在大多数都用Vue
6. 单向数据流，没有实现数据的双向绑定。数据->视图->事件->数据这样一个闭环

React.StrictMode

https://blog.csdn.net/weixin_42566993/article/details/108312158

注意：
严格模式检查仅在开发模式下运行；它们不会影响生产构建。

<React.StrictMode>
   <div></div> // 会对React.StrictMode下的所有子集进行严格检查
 </React.StrictMode>

作用：

1. 识别不安全的生命周期
2. 关于使用过时字符串 ref API 的警告
3. 关于使用废弃的 findDOMNode 方法的警告
4. 检测意外的副作用
5. 检测过时的 context API

React JSX

优点：

1. jsx执行更快，编译为JavaScript代码时进行优化
2. 类型更安全，编译过程如果出错就不能编译，及时发现错误
3. jsx编写模板更加简便快速（出vue之前确实如此）

注意：

1. jsx必须要有根节点
2. 正常的普通HTML元素要小写，如果是大写，默认认为是组件

JSX表达式

1. 由HTML元素构成
2. 中间如果需要插入变量用{}
3. {}中间可以使用表达式
4. {}中间表达式中可以使用JSX对象
5. 属性和HTML内容一样都是用{}来插入内容

JSX_样式

1. style中，不可以存在多个className属性（用class控制台会报错，要加上Name）
2. 存在多个单词的属性组合要使用驼峰法（第二个单词首字母大写）
3. 多类共存<h1 className={"abc "+ ccc}></h1>
4. 注释：{/* 这里写注释*/}