Question

我正在尝试将HOC应用于自定义组件中的每个孩子。但是我无法解决如何为动态包装的组件类型实现此功能。假设我们有：

function myHOC<P>(WrappedComponent: React.ComponentType<P>):React.ComponentType<P> {
    return class extends React.Component<P> {
      ...
        render() {
            return <WrappedComponent />;
        }



const MyHOC = myHOC(???); //It won't do!

class MyComponent extends React.Component<Props, State> {
    ...
    render() {
        const items = this.props.children.map((child) => {
            <MyHOC /> //I want to use it something like this!
        }); 

        return ( 
            <div>
                {items}
            </div>
        );
    }
}

我需要添加什么？

Answer 1

您不能动态应用HOC。如果要动态使用共享状态逻辑，可以考虑渲染道具模式。

如何动态应用HOC

1 个答案: