JSX
JSX中使用原生html（dangerouslySetInnerHTML属性）
想要让原生html在JSX中正常显示，需要将其写在dangerouslySetInnerHTML属性内：
条件判断
(和js使用方法一样)**if else、三元表达式、逻辑运算符&&/||**：
map()渲染列表
map():可参考React.js基础精讲，需要注意map不会改变原数组，且它的返回值（数组）可直接渲染在页面上，不需要另外拆分
事件
react事件函数为何需要bind绑定this
- 关于this可参考博客“JS作用域和闭包”，关于 react事件函数为何需要bind绑定this 可参考博客“bind()”
- react中的事件函数需要在构造函数中使用bind()绑定this后才能在事件函数中使用this，否则事件函数中的this默认是undefined。我们需要绑定this使得无论事件函数如何传递，它的this的指向都是固定的，固定指向我们所实例化的对象（父组件）
- 例子：
不需要bind this 事件函数的方法
- 借助react-redux库使用redux管理数据则不存在需要bind绑定this的事情，毕竟不存在
this.setState或者this.state，直接操作state就行。 - 使用箭头函数定义事件函数，则this固定指向当前组件：
联系：js回调函数this指向
- 可参考ES6扩展 函数扩展 箭头函数 中“回调函数中的this”
- 回调函数中的this默认是指向windows的，可以用闭包/箭头函数获取
关于event参数（事件对象）
- 系统在调用事件函数时，把事件会发生的一切信息，都封装成一个对象，然后作为一个参数传递给事件处理程序，而这个对象就是事件对象。在原生的函数中，经常会看见一个event的东西，而这个东西就是我们说的事件对象。
- 调用事件函数时不传参数，则事件函数的定义中获取到的参数为event（当前元素）。
- 例子：
- react中的event 是react封装的 SyntheticEvent（组合事件【合成对象】），模拟出了 DOM 事件对象 所有的能力
- event.nativeEvent 才是原生事件对象
- react中所有的事件都被挂载到 document 上，而原生的事件是绑定到DOM上面的
- react事件 和 DOM 事件不一样，和 Vue 事件也不一样
联系：js中事件函数的event
- 事件绑定函数可接受的第一个参数是事件对象。
传递自定义参数
- 事件函数传递自定义参数时，在事件函数的定义中可在最后追加一个参数，即可接收 event
- 例子：
表单（受控组件）
- 受控组件:组件的值（value/checked）可受到state的控制（即state变化时组件值变化）
- 非受控组件（在后面的“高级特性”博客中详细讲解）：组件中的值无法受state的控制
- 例子：比如input组件，想要页面上实时显示我们输入的内容是需要让其value与state相关联的
（注意区别 defaultValue属性 和 value属性） - 注意：
- 常见的受控组件： input组件（checkbox、radio）、textarea组件、select组件
- textarea组件 也是受控组件，但**在react中需要使用
<textarea/>**，而html中是<textarea><textarea/>。 - 在react中label标签**使用
htmlFor代替for属性**。
区别 defaultValue属性 和 value属性
- 注意：区别react中input的 defaultValue属性 和 value属性
- react中input的defaultValue就相当于原生DOM中的value属性，这样写出来的组件，其value值就是用户输入的内容，和react没有关系，完全不管输入的过程。
- 而react中input的value属性必须使用onChange来监听这个input，使state和input关联（即 受控组件）
- 如果在使用input时只需要获取model里的值时，使用defaultValue就可以了。如果需要获取model的值并且还需要改变它的时候，就需要使用value结合onChange事件与state联系就可以了。（但还是尽量使用value，毕竟defaultValue需要结合ref来获取DOM元素，而react的设计初衷就是尽量不要操作DOM，通过state来带动DOM）
input textarea select用value
- textarea组件：
- select组件：
- input组件例子在上方
checkbox radio用checked
- checkbox：
- radio：
组件使用
补充：长的和props类型检查（propTypes）很像的是js原型的隐式原型__proto__和显式原型prototype
props类型检查（propTypes）
- PropTypes 强校验可参考博客“React高级内容（1）”
- 子组件在接受父组件传过来的值（即 属性 ）时进行强校验。他可以要求父组件给子组件传的值是什么类型的。如若不是也并不会报错，只会在 开发者工具 中给出警告。
props传递数据/函数(React父子组件通讯)
- 基础通讯方法 可参考博客 围绕 React 衍生出的思考，还可以使用redux管理数据
- 父组件向子组件传值/函数：在父组件中调用子组件的同时通过给子组件添加属性的方式向子组件传值/函数，注意如要传递函数，则需在父组件构造函数中使用bind绑定该函数this指向
- 原因：绑定this指向父组件，以免在子组件中使用函数时this指向不是我们所期望的。
- 子组件使用父组件传递的值/函数：通过
{this.props.属性名/函数名}来调用 - 子组件修改父组件中数据的方法：子组件通过调用父组件传递过来的函数间接的操作父组件的数据
数据（状态）提升
- 数据（状态）提升：将数据提到最高的组件中存放。
- 设计思路：数据都放在 父组件 中进行管理，父组件将数据下发到各个子组件中进行处理/渲染。
- 例子：
