写在前面：最近抽时间温习了下react文档，记录下自己觉得比较重要的点
-
jsx是在js代码中可以直接写标签（包含自定义组件（手写字母大写），或者普通h5标签）
-
在写jsx和vue一样只支持单个根节点，但是在react中可以将根节点变成react推荐的 Fragment 标签
-
react中有函数组件和基于class的组件，函数组件可以直接返回元素（jsx语法），基于class的组件需要基于react.Component这个基类定义
-
对于在react实现v-if，可以直接
<div>{count > 0 && Component1}<div>或者<div>{count > 0 ？ Component1 ： Component2}<div>，使用三元运算符； -
对于在react中实现v-show，使用三元运算符，然后更改class即可
-
对于react推荐的数据流转： 在子组件中调用父组件的方法（该方法基于props传入子组件），用以更新父组件的state，然后再讲更新的数据传入子组件，子组件中直接绑定props.date, 进而更新视图
-
react中并没有slot的概念，默认props.children可以传递单独的元素；也可以以属性的形式直接指定其余的组件，其实就类似是将html直接以属性的形式传过去
-
react中v-for的实现，直接在render中，使用map实现
-
父子组件通信基于props即可；兄弟组件通信直接公用父组件；不相邻组件通信用redux，类似于vuex
-
对于css的写法：一般是index.css文件，然后通过直接 import ‘./index.css’ 引入； 同时在元素上class 属性变成className
-
在组件中定义函数时，默认基于箭头函数语法进行定义，只有这样才能使函数内部this生效,无需bind this
handleClicked = (val) => {
this.props.changeTitle(val)
}
-
对于组件中this的使用要注意，防止this指向有问题
-
基于propType对组件的props参数作类型校验
import PropTypes from 'prop-types';
class Greeting extends React.Component {
render() {
return (
<h1>Hello, {this.props.name}</h1>
);
}
}
Greeting.propTypes = {
name: PropTypes.string
};
-
基于defaultProps给props赋默认值
-
对于ref的写法和调用和vue有区别： 写法
<ul ref = {(ul) => this.ul = ul}> 测试 </ul>调用： 直接在函数里调用 this.ul 即可 -
父组件的render函数重新执行，会导致子组件的render也执行，那假如子组件的props没有发生变化，如何避免子组件render重新执行呢？ 可以使用 shouldComponentUpdate这个钩子，比对当前props和更新props的区别，假如有区别返回TRUE，执行更新，否则返回FALSE不更新
-
使用react-transition-group这个库实现动画效果：对于js动画，transition, transform都可以
-
关于redux的学习 redux类似于vuex, 用来做全局数据管理
- 对于React-redux中间件的使用： 被provider包裹的组件中都可以拿到store中的数据
在组件中，使用connect方法，连接该组件和store
mapStateToProp是直接将store中的inputValue映射到props中的inputValue
mapDispathToProps是可以直接调用store.dispatch方法， 更改store中的数据
