React (高阶组件)
在react中一切皆为组件
1、类组件 2、函数组件 3、受控组件 4、 非受控组件 5、UI组件
6、容器组件 7、高阶组件 8、无状态组件
高阶组件:(简写‘HOC’)
高阶组件就是一个函数,接收一个组件参数当做组件,返回一个增强性的组件
高阶组件返回的不再是一个类组件,而是函数组件,当函数组件执行时,返回一个类
在使用高阶组件时,先引用高阶函数,再去调用这个函数,把当前类名带入函数内当参数
接收的时候,渲染页面,在页面上输出结果
当使用柯里化函数时,
在别的组件引用时也可以使用
例:header组件就相当于是一个模板,具体的内容都是高阶组件产生的,经过高阶组件的包裹,输出的是一个类
所以高阶组件内容出现两次
当前类当参数带入高阶函数时,高阶函数中可以对当前类做一系列的修饰
使用场景:判断token值是否存在
利用高阶组件对跨组件传值进行二次封装
先创建跨组件传值基础部分
consumer中返回一个函数,高阶函数当把参数带入时,进行返回,
value值是生产者产生的数据,这时就可以把value值传入
高阶组件是一个函数,高阶组件接收一个组件当参数,返回一个增强性组件,引用高阶组件
把当前类当参数带入。当前组件可以通过this.props进行接收
当生产者产生多条数据时,以上方法就把所有的信息进行传递
所以可以再次进行二次优化,传递只需要的数据
利用柯里化传多个函数,第二个函数必须要返回一个对象
定义一个函数,函数返回对象,函数中的参数相当于是生产者产生的数据
需要某个具体数据时 ,进行获取就可以了
高阶组件获取到的值就是在定义函数时需要的的具体的值