Question

我正在使用重组库，并且有一堆彼此构建的HoC，每个都需要以前的props作为参数。看起来像这样：

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

因此您可以看到withAnotherHoC所需的参数必须来自道具。但是我不知道我怎么能得到它。这是我已经尝试过的：

只需使用箭头函数希望它们将被传入：

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)

到目前为止，这些方法都没有，所以我该怎么做？

我确实认为造成麻烦的原因之一是因为我不太了解道具是如何传递的，所以我道歉，如果这只是我的愚蠢之举。

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)

将props作为参数传递给compose中的另一个HoC

1 个答案: