reactjs - 如何渲染组件的子组件而不是整个组件

Question

我有一个react-bnb-gallery带有单个默认导出组件的包，名为ReactBnbGallery. 它通过门户显示图库并且效果很好，但我的目标是将该图库内联在 html 中并嵌套在组件树中。

目前我有什么：

<SomeWrapperComponent>
  <ReactBnbGallery />     // contains not accessible <Gallery/> 
<SomeWrapperComponent />

我想要这个：

<SomeWrapperComponent>
  <Gallery/> 
<SomeWrapperComponent />

通过这种方式，我想省略门户并将画廊放在我的布局中。有什么建议么？？？

我考虑过一些 HOC，<ReactBnbGallery> 或者 Portals 有一些 api 或其他切换器来简单地关闭

提前谢谢！

Answer 1

Gallery现在可以在门户之外访问该组件。

现在可以使用以下代码：

import { Gallery } from 'react-bnb-gallery';

const MyComponent = () => (
  <Gallery photos={[...]} />
);

如果您还想使用主要ReactBnbGallery组件，则新方法是执行以下操作：

import { ReactBnbGallery } from 'react-bnb-gallery';

const MyComponent = () => (
  { /* ReactBnbGallery wraps the Gallery component */ }
  <ReactBnbGallery photos={[...]} />
);

更新已在NPM中以新版本1.1.7发布。