javascript - react native 和 redux 中的 hoc 组件?
问题描述
我想在用户请求Api
调用时显示微调器,并且我将每个组件传递给更高阶的组件以检查是否请求显示微调器,否则不
但在这里我得到一个错误,说不能将类调用为函数
//-------------Hoc Component
HOC=component=>class extends React.component{
render(){
(return <component {...props} {...state}/>)}
}
}
export default connect(mapStateToProps)(HOC)
//----------login component
export default HOC(connect(mapStateToProps,{actions})(Login))
如果没有 HOC,它可以正常工作,但 HOC 会出错。请让我知道如何连接两个高阶组件的解决方案
解决方案
试试这个代码
const HOC = WrappedComponent => {
class abc extends Component {
render () {
return (
<WrappedComponent {...this.props} {...this.state} />
);
}
}
const mapStateToProps = state => ({ state });
const mapDispatchToProps = dispatch => bindActionCreaters({..actions}, dispatch);
return connect(mapStateToProps, mapDispatchToProps)(abc);
}
export default compose(
HOC,
connect(mapStateToProps)
)(Login);
推荐阅读
- javascript - npm 卡在“正在启动开发服务器...”
- c# - 使用 Try Catch 处理逻辑
- r - 如何更改ggplot中图例的样式,使每个元素周围都有一个矩形?
- python - 解析对象树的类结构
- python - forkserver 不在子进程中重用
- node.js - 有人知道为什么即使一切都通过了测试,mocha 还是会抛出错误?
- sql - 如何使用窗口函数计算每列转置的结果
- intellij-idea - 当我尝试运行 junit 时,我的意思是如下所示的 intellij 错误
- django - 在 gitlab CI django 中访问私有数据 .env 文件
- javascript - 设置 Webpack 和 Babel 的问题