reactjs - 如何转换 HOC 以响应自定义钩子

Question

我有下面的代码片段，只是想知道除了将组件传递给之外withGroupInput，我们还有另一种方法可以将它GroupedInputWithLabel与不同的组件一起使用吗？谢谢

export const GroupedInputWithLabel = (props) => {
  const { required, children, fieldName } = props;
  const inputComponent = (
    <>
      <ControlLabel htmlFor={fieldName} required={required} />
      {children}
    </>
  );
  return <GroupedInput {...props}>{inputComponent}</GroupedInput>;
};

export const withGroupInput = (props, Component) => (
  <GroupedInputWithLabel {...props}>
    <Component {...props} />
  </GroupedInputWithLabel>
);