react核心概念

/**

* **jsx**:表示对象。babel会把jsx转义成一个名为React.createElement()函数调用

* 这些对象被称为react元素，它们描述了你希望在屏幕上看到的内容，react通过

* 读取这些对象，然后使用它们来构建dom以及保持随时更新。

* **元素渲染**

* 元素是构成React应用的最小砖块，描述了你在屏幕上想看到的内容

* 与浏览器的 DOM 元素不同，React 元素是创建开销极小的普通对象，React DOM

* 会负责更新 DOM 来与 React 元素保持一致。

* **在实践中大多数react应用只会调用一次ReactDOM.render()**

* React DOM只会更新实际改变了的内容

* **props**

* 当react元素为用户自定义组件时，它会将jsx接受的属性转换为单个对象传递给组件，

* 这个对象被称为"props"

* 无论是函数声明还是class声明的组件，都不能修改自身的props

* 如果在一个组件中return一个null，则表示此组件是空的，什么都不会渲染

* **state**

* state的更新可能是异步的，因为this.props和this.state可能会异步更新，所以不要

* 依赖他们的值来更新下一个状态。可以让state接收一个函数而不是一个对象。

* 有状态组件与无状态组件的区别就是有无state属性，有无生命周期函数。

* **数据流是向下流动的**

* 任何的state总是所属于特定的组件，而且从该state派生的任何数据或ui只能影响树中

* 低于它们的组件。

* **事件处理**

* 在react中不能通过返回false的方式阻止默认行为，必须显示使用preventDefault

* react的事件对象e会被作为第二个参数传递，如果通过箭头函数的方式，事件对象必须

* 显示的进行传递

* **条件渲染**

* &&运算符：true && expression 总是会返回expression，而false && expression总

* 是会返回false。

* 阻止组件渲染：直接返回null，在组件的render方法中返回null，并不会影响组件的生命

* 周期。

* **列表 & key**

* key帮助react识别哪些元素改变了。如果不显示指定key的值，默认使用索引作为key值。

* 元素的key只有放在就近的数组上下文中才有意义。

* **表单**

* 受控组件：input(type=text)、textarea、select

* 非受控组件:input(type=file,因为他的value只读)

* **状态提升**

* 将多个组件中需要共享的state向上移动到它们的共同的最近父组件中

* **组合与继承**

* react有十分强大的组合模式，推荐使用组合来实现组件间的代码重用

* 1.一个组件在使用时它的所有内容都会作为一个children prop传递给定义它时的props，{pros.children}

* 2.也可以给组件内部的子组件起一个别名 xx={<子组件/>}，在定义组件中用props.xx引用

* **组件可以接受任意 props，包括基本数据类型，React 元素以及函数**

*

*

*/