React杂技整理

东西比较乱是边做变整理的一些知识点
-version 16.6.1
react 初始化事件值
注意 onClick className
组件生命周期问题

组建名必须以大写字母开头

子类向父类触发父类事件或者父类state状态变更

子类和父类的定义没有变量提升的问题

子类继承父类用props 只读

map循环数组记得return

三元运算法则多个html 或者多个三元运算法则在render的解决方式为变为数组

this.handleclick.bind（this，要传的参数） handleclick（传过来的参数，event）
单行注释 {/* /}
多行注释 / */

在理想状况下，一个组件应该只做一件事情如果这个组件功能不断丰富，它应该被分成更小的组件。

父类componentDidMount 异步请求子类componentDidMount 不执行因为初次没有值传入

function handleObject(v){
    var a = {};
    for(var i in v){
        if(v[i] instanceof Object){
            a = Object.assign(handleObject(v[i]),a)
        }else{
            a[i] = v[i]
        }
    }
    return a
}
var e = {a:1,b:3,f:{s:3,b:4,g:{o:5,b:5,g:2}}}
var mm = handleObject(e);

var a = [1,3,4,5,56,76,[2,3,4,45,56,[2,3,4,4,56,[23,4,5,65]]]]
function handleArray(value){
    var c = []
    for(var i =0;i<value.length;i++){
        if(value[i] instanceof Array){
            c = c.concat(handleArray(value[i]));
        }else{
            c.push(value[i])
        }
    }
    return c
    
};
var d = handleArray(a);

递归数组 concat 对象 Object.assign

新生命周期在各个阶段的调用情况
挂载

constructor
getDerivedStateFromProps

render

componentDidMount

更新

getDerivedStateFromProps

shouldComponentUpdate

render

getSnapshotBeforeUpdate

componentDidUpdate

卸载

挂载阶段，只有当执行到render的时候，父组件的constructor才开始执行，知道子组件挂载完成（componentDidMount），父组件才算挂载完成
更新阶段，类似挂载阶段，只有父组件执行到render，才开始子组件的getDerivedStateFromProps -> shouldComponentUpdate -> render，但再父组件的getSnapshotBeforeUpdate是紧随在子组件的getSnapshotBeforeUpdate后，然后子组件在componentDidUpdate

父组件调用forceUpdate
组件调用forceUpdate方法后，不会执行shouldComponentUpdate，会执行getDerivedStateFromProps，然后再render，后面的生命周期和更新一致

label 属性for 为htmlFor

传送门：React Portal

React杂技整理

推荐阅读更多精彩内容