Arrays 如何从已循环数组中具有多个图像的映射api中获取要显示的多个值？

我试图通过一个带有图像的API进行循环，我将把它改为水果，以使其更易于阅读

let arr = [
  {src: "mango, banana"},
  {src: "melon"},
  {src: "apple"},
  {src: "pear"},
]

请注意“苹果、香蕉”是如何组合在一起的

如果我映射它们

arr.map（e=>e.src）

结果如下

[ 'mango, banana', 'melon', 'apple', 'pear' ]

当我尝试执行

arr.map（e=>e.src.split（'，'））

时，它会被分开，但我不能像这样使用它

[ [ 'mango', ' banana' ], [ 'melon' ], [ 'apple' ], [ 'pear' ] ]

let pushed = arr.map(e => e.src)
console.log(pushed[0]);
// output: mango, banana

如何访问或分离第一个单个数组，我需要它为react应用程序渲染图像，但有些字段有多个图像，这会破坏代码

我想要的结果是将它们全部分离为单个字符串

[ 'mango', 'banana', 'melon', 'apple', 'pear']

我试过这样的东西

[ [ 'mango', ' banana' ], [ 'melon' ], [ 'apple' ], [ 'pear' ] ]

let pushed = arr.map(e => e.src)
console.log(pushed[0]);
// output: mango, banana

---

我可以选择这些，我可以分割它们并使用它们，但这太难了，我需要它是动态的，因为我得到了4000多张图片，我不能检查每个字段，看看我必须更改哪一个，你可以使用。减少功能，以得到你想要的结果

arr.reduce((prev, current)=> [...prev, ...current.src.split(',')], []);

---

你接近一个正确的解决方案了。如果在

.map

函数之后传递一个

.flat

，它会将数组展平到这样一个级别

arr.map（val=>val.src.split（“，”）.flat（）

如果可以，请做两件事：发布代码，并用文本本身替换文本图像。Maaann xd，我需要更改这个问题，我认为我做错了，对不起，我会再次编辑它。您可以使用第二种方法展平生成的数组。请参阅。谢谢！！