javascript - 在 compose 中将 props 作为参数传递给另一个 HoC

Question

我正在使用重组库，并且有一堆 HoC 相互构建，每个 HoC 都需要以前的 Prop 作为参数。这是它的样子:

export default compose(
  withSomeHoC(param1, param2),
  withAnotherHoc(myFunction.bind(undefined, requiredValuePassedAsPropsFromWithSomeHoC)),
)(MyComponent)

因此，正如您所见，withAnotherHoC 所需的参数必须来自 props。但我不知道我怎么能得到它。这是我已经尝试过的:

只是使用一个箭头函数希望它们能被传入:

export default compose(
  withSomeHoC(param1, param2),
  (ownerProps) => withAnotherHoc(myFunction.bind(undefined, ownerProps.myRequiredParam))
)(MyComponent)

使用 withProps 函数:

export default compose(
  withSomeHoC(param1, param2),
  withProps(ownerProps => withAnotherHoc(myFunction.bind(undefined, ownerProps.myRequiredParam)))
)(MyComponent)

到目前为止，这些都不起作用，那么我该如何实现呢？

我确实认为我遇到麻烦的原因之一是因为我不太了解 Prop 是如何传承下来的，所以如果这只是我的愚蠢行为，我深表歉意。

Answer 1

这可以通过自定义 HOC 来解决:

const myHoc = Comp => props => {
  const CompWithAnotherHoc = withAnotherHoc(myFunction(props.myRequiredParam))(Comp);
  return <CompWithAnotherHoc ...props />;
};

export default compose(
  withSomeHoC(param1, param2),
  myHoc
)(MyComponent)