带TypeScript的条带化ElementsConsumer : Pass prop？

import React, { ComponentType } from 'react';

interface Props {
  // 定义需要传递的属性类型
  myProp: string;
}

// 定义条带化组件的类型
interface HOCProps {
  // 定义条带化组件接受的属性类型
  hocProp: string;
}

// 定义条带化函数
function withElementsConsumer<T extends Props>(
  WrappedComponent: ComponentType<T>
): ComponentType<T & HOCProps> {
  // 返回一个新的组件
  const EnhancedComponent: ComponentType<T & HOCProps> = (props) => {
    // 在这里可以对属性进行处理
    const { hocProp, ...restProps } = props;

    // 将hocProp传递给被包裹的组件
    return <WrappedComponent {...restProps as T} />;
  };

  return EnhancedComponent;
}

// 使用条带化函数包裹组件
const MyComponent: React.FC<Props & HOCProps> = (props) => {
  // 在这里可以使用传递的属性
  const { myProp, hocProp } = props;

  return (
    <div>
      <p>myProp: {myProp}</p>
      <p>hocProp: {hocProp}</p>
    </div>
  );
};

// 使用条带化函数包裹组件
const EnhancedComponent = withElementsConsumer(MyComponent);

// 使用EnhancedComponent组件
const App: React.FC = () => {
  return <EnhancedComponent myProp="Hello" hocProp="World" />;
};

export default App;