在 React 中将组件数组作为 Props 传递

Question

我正在寻找一种将组件数组传递给选项卡组件的道具的方法。只是想知道这是否可能。

\n\n

因此，我需要创建一个组件来缩短材质 ui 的选项卡方法，但我找不到一种方法来将组件数组作为 prop 传递，以便将其渲染在该组件上。

\n\n

这是我的代码的示例：

\n\n

<FullWidthTab\ncomponents = [<Component1/>, <Component2/>] //this is where components renders\n menuLabels = ['Menu1', 'Menu2'] //this is where title render\n/>\n

\n\n

我将它们映射到我的代码上，如下所示，并使用了 lodash 映射方法：

\n\n

map(components, component=>{\n\n <TabContainer>{component}</TabContainer>\n\n}\n

\n\n

但它返回这个。\n警告：react-swipeable-view：提供的子项之一无效：null。\n我们期待一个有效的 React 元素

\n\n

当我的console.log组件它返回：\n{$$typeof: Symbol(react.element), type: \xc6\x92, key: null, ref: null, props: {\xe2\x80\xa6}} Object Need帮助

\n\n

我希望它可以渲染组件。

\n

Answer 1

因为您需要在地图中返回一个值。

map(components, component=>{

 return <TabContainer>{component}</TabContainer>

}