使用 map 函数创建 React 组件

Using map function to create React components

我想为每个标签映射值和 return 我的 <FirstRepeatAttributeLabelAssistant /> 实例(基本上是在每个输入上方呈现一个标签,输入的数量可能会有所不同)。

我从这个开始:

{object.attributeCollection.questions.map((question) => (
   <FirstRepeatAttributeLabelAssistant />
))}

上面地图的输出是这样的:

[StringAttributeModel, MemoAttributeModel, LabelAttributeModel, MemoAttributeModel, StringAttributeModel, StringAttributeModel] 我只关心“StringAttributeModel”,因为这 3 个中的每一个都包含 3 个不同的标签(我关心的部分)。他们的结构是这样的:

如何更新我的逻辑以确保覆盖所有可能的标签并为每个标签呈现一个 <FirstRepeatAttributeLabelAssistant /> 组件?

假设你所有的元素都是一个组件,那么你可以简单地做。

{object.attributeCollection.questions.map(Comp => {
  ...
  return <Comp label="..." />
})}

您可以在 ... 区域填写您的自定义逻辑。