Question

我通过容器将容器的提供者包装为容器，完成了

const withContainer = Container => Component => _ =>
<Container.Provider>
    <Component />
</Container.Provider>

我这样使用：

const MyContainer = createContainer(useState) // from unstated-next
const MyProvidedComponent = withContainer(MyContainer)(MyComponent)

我想用不带一个容器而是带多个容器的容器来做类似的事情：

withContainer([C1, C2, C3])(MyComponent) //C1,C2,C3 being containers

将返回如下内容：

<C1.Provider>
  <C2.Provider>
    <C3.Provider>
      <MyComponent />
    </C1.Provider>
  </C2.Provider>
</C3.Provider>

Answer 1

您需要从内到外包装MyComponent：

var components = [C1, C2, C3]; // or [C1, C2, C3].map(c=>c.Provider) if components are contexts

let result = <MyComponent/>;

for (const Component of components.slice().reverse()) {
    result = (
        <Component>
            {result}
        </Component>
    );    
}
return result;

从数组嵌套组件

1 个答案: