reactjs - 如何处理 React HOC 嵌套

Question

我非常感谢 React 中的 HOC。这真是很酷的东西：

export default withStyles(styleSheet)(MyComponent);

但是有一天我发现在我的项目中的很多组件上都有几个嵌套的 HOC：

export default 
  withCheckingAccess(ACCESS)(
    withHoc1(
      withHoc2(
        withHoc3(
          connect(mapStateToProps, mapDispatchToProps)(withStyles(styleSheet)(MyComponent))
        )
      )
    )
  )
);

这看起来真的很丑陋，所以我很感兴趣什么是最佳实践，或者也许是一个好的 NPM 库来处理这个问题。例如将其转换为：

export default awesomeHocsDealer(
  [
    withCheckingAccess(ACCESS),
    withHoc1,
    withHoc2,
    withHoc3,
    withStyles(styleSheet)
  ],
  connect(mapStateToProps, mapDispatchToProps)(MyComponent),
);

标签： reactjs