Javascript 获取对象数组外部的对象

我有一点复杂的混合对象和数组，我正在寻找一种方法来平坦数组，这样当我试图渲染它时就不那么复杂了

基本上我有一些输入字段，有一个选项可以添加带有自定义标签和值的自定义字段，但是它在DB中的存储方式标签是

customLabel

，值是所有添加的自定义字段的数组

    const keyTerms = [
    {label: 'pre-set label', value: 'some value'},
    {label: 'pre-set label', value: 'some value'},
    {label: 'customLabel', value: [{}, {}]}
    ];

在我的React组件中，我通过该数组映射以显示对象，但是当我点击具有数组作为值的对象时，我得到一个错误，因为该组件需要的是字符串而不是数组

    {keyTerms.map(keyTerm => <Component keyTerm={KeyTerm} />}

有没有办法从第三个对象值数组内部获取对象并将其放入外部数组？

尝试下面的代码：（但是，从标签/描述字段中创建一个可重用的组件是值得的，这样就不会重复）

Array.isArray（keyTerm.value）
? keyTerm.value.map（ele=>(
{ele.label}
{ele.value}
))
: (
{keyTerm.label}
{keyTerm.value}
)

如果是数组，您希望渲染结果是什么？请务必顺便使用键。此外，此处还需要更多信息。再多解释一下你想做什么。为什么值可以是对象数组或字符串。还有，组件对keyTerm做了什么？@CertainPerformance组件是这样的：``{keyTerm.label}{keyTerm.value}``对于数组，我试图检查：array.isArray（keyTerm.value），然后通过它进行映射，并在映射中呈现上面的代码，否则在没有map@TarekAlBeb这应该行得通

Array.isArray(keyTerm.value)
? keyTerm.value.map(ele => (
   <>
     <Label>{keyTerm.label}</Label>
     <Description>{keyTerm.value}</Description>
   </>
))
: (
   <>
     <Label>{keyTerm.label}</Label>
     <Description>{keyTerm.value}</Description>
   </>
)

Uncaught Error: Objects are not valid as a React child (found: object with keys {label, description, __typename}). If you meant to render a collection of children, use an array instead.

Array.isArray(keyTerm.value)
? keyTerm.value.map(ele => (
   <>
     <Label>{ele.label}</Label>
     <Description>{ele.value}</Description>
   </>
))
: (
   <>
     <Label>{keyTerm.label}</Label>
     <Description>{keyTerm.value}</Description>
   </>
)