我如何打印使用映射数组的数组与数组中的对象反应?

Question

我有一个功能组件，它接受一个带有对象的数组，但我不知道如何在渲染的返回函数中访问数据

let dataItems = [
[
{
data1: "1234",
data2: "ABCD",
data3: "5678",
data4: "EFGH",
},
{
data1: "10203040",
data2: "A1B1C1D1",
data3: "50607080",
data4: "EFGH",
},
{
data1: "6789",
data2: "jklm",
data3: "1000",
data4: "EFGH",
},
{
data1: "128",
data2: "zwxy",
data3: "5",
data4: "lmno",
},
],
[
{
data1: "1234",
data2: "ABCD",
data3: "5678",
data4: "EFGH",
},
{
data1: "10203040",
data2: "A1B1C1D1",
data3: "50607080",
data4: "EFGH",
},
{
data1: "6789",
data2: "jklm",
data3: "1000",
data4: "EFGH",
},
{
data1: "128",
data2: "zwxy",
data3: "5",
data4: "lmno",
},
],
];

我试图将数据传递给另一个组件来打印数据，但我不知道如何通过map函数传递一个未命名的数组。

我的代码。

dataItems.map((item, index) => {
return ( 
{ item.content.map((c, i) =>
<PrintComponent>
)
}
)
})

我将使用bootstrap 4 tabs以4个元素为块打印一个二维矩阵

我试图将数据显示为像这样的二维数组

<表类>第一行row2row3row4tbody><<tr>data01data02data03data04data05data06data07data08

我解决了在地图中制作组件。

使用这些行

dataItems.map((item) => {
return item.map((items) => { console.log("data1", items.data1)});
});

向我提供了几次数据，所以我只包含一次切片

dataItems.slice(0, 1).map((item) => {
return item.map((items) => { console.log(items)});
});

为此，您必须使用多个地图进行数据渲染。

例如:

dataItems.map((item) => {
return item.map((items) => { console.log("data1", items.data1)});
});