我正在寻找一种将组件数组传递给选项卡组件的道具的方法。只是想知道这是否可能。
因此，我需要创建一个组件来缩短材质 ui 的选项卡方法，但我找不到一种方法来将组件数组作为 prop 传递，以便将其渲染在该组件上。
这是我的代码的示例：
<FullWidthTab
components = [<Component1/>, <Component2/>] //this is where components renders
menuLabels = ['Menu1', 'Menu2'] //this is where title render
/>
我将它们映射到我的代码上，如下所示，并使用了 lodash 映射方法：
map(components, component=>{
<TabContainer>{component}</TabContainer>
}
但它返回这个。
警告：react-swipeable-view：提供的子项之一无效：null。
我们期待一个有效的 React 元素
当我console.log它返回的组件：
{$$typeof: Symbol(react.element), type: ƒ, key: null, ref: null, props: {…}} 对象 需要帮助
我希望它可以渲染组件。
组件的名称必须以大写字母开头，但是我可以在这里看到components = [<component1/>, <component2/>]他们不是。所以你必须转换[<component1/>, <component2/>] to [<Component1/>, <Component2/>]。我看到你的第二件事map语法很奇怪，它一定是这样的：
components.map(component => (<TabContainer>{component}</TabContainer>))
参考：https://reactjs.org/docs/jsx-in-depth.html#user-define-components-must-be-capitalized https://reactjs.org/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
