React详解

介绍：

React是一个用于构建用户界面的javaScript库，起源于facebook的内部项目，在13年f进行开源

17版本官网：React – A JavaScript library for building user interfaces

18版本官网：React 官方中文文档

特点：

1. 声明式编码
2. 组件化编码
3. React Native 编写原生应用
4. 高效（优秀的Diffing算法）

一、基础

主要核心，依赖下面四个文件

1、基本使用

1.1、虚拟dom

关于虚拟DOM:

• 本质是object类型的对象(一般对象)
• 虚拟DOM比较“轻”，真实DOM比较“重”，因为虚拟DOM是React内部在用，无需真实DOM 上:那么多的属性。
• 虚拟DOM最终会被React转化为真实DOM。呈现在页面上

 2.2、JSX写法

1、全称:  JavaScript XML。

2、react定义的一种类似于XML的JS扩展语法: JS + XML本质是React.createElement(component, props, ...children)方法的语法糖

3、作用: 用来简化创建虚拟DOM

     写法：var ele = 

Hello JSX!

     注意1：它不是字符串, 也不是HTML/XML标签

     注意2：它最终产生的就是一个JS对象

4、jsx语法规则:

1. 定义虚拟DOM时，不要写引号。
2. 标签中混入JS表达式时要用{}-
3. 样式的类名指定不要用class，要用className.
4. 内联样式,要用style={{key : value}}的形式去写。
5. 只有一个根标签
6. 标签必须闭合
7. 标签首字母

         (1).若小写字母开头，则将改标签转为htm1中同名元素，若htm1中无该标签对应的同名元素，则报错。

         (2).若大写字母开头，react就去渲染对应的组件，若组件没有定义，则报错。

2、函数式组件

3、类组件

4、组件的三大核心

4.1、state：存放状态

(1)、state简写

 4.2、props：接收参数