构造组件的输入数组，以typescript格式格式化数据(Anuglar/React)

Question

下面的数组是组件的输入。如果将此输入传递给组件输出，则显示良好。

const data = [
['Rank', 'Player', 'Player', 'Player'],
['1', 'sachin', 'dravid', 'ganguly'],
['2', 'pointhig', 'mcrath', 'warne'],
['3', 'sanath', 'murali', 'vaas'],
['4', 'akram', 'younis', 'akhamed'] 
]  

但我的api响应如下。我尝试将api转换为上面的输入数据。排名列应该是自动递增的。我试着像上面那样转换，但我没能转换。

0:Array(3)
0:{fullname:'sachin'}
1:{fullname:'dravid'}
2:{fullname:'ganguly'}
1:Array(3)
0:{fullname:'pointhig'}
1:{fullname:'mcrath'}
2:{fullname:'warne'}
2:Array(3)
0:{fullname:'sanath'}
1:{fullname:'murali'}
2:{fullname:'vaas'}
3:Array(3)
0:{fullname:'akram'}
1:{fullname:'younis'}
2:{fullname:'akhamed'}

Answer 1

const header = ["Rank", "Player", "Player", "Player"];
const data = [
[{ fullname: "sachin" }, { fullname: "dravid" }, { fullname: "ganguly" }],
[{ fullname: "pointhig" }, { fullname: "mcrath" }, { fullname: "warne" }],
[{ fullname: "sanath" }, { fullname: "murali" }, { fullname: "vaas" }],
[{ fullname: "akram" }, { fullname: "younis" }, { fullname: "akhamed" }]
];
const content = data.map((item, idx) => [
(idx + 1).toString(),
...item.map(x => x.fullname)
]);
const result = [...[header], ...content];
console.log(result);

Answer 2

您可以使用嵌套的map()

const arr = [[
{fullname:'sachin'},
{fullname:'dravid'},
{fullname:'ganguly'}
],
[{fullname:'pointhig'},
{fullname:'mcrath'},
{fullname:'warne'}],
[{fullname:'sanath'},
{fullname:'murali'},
{fullname:'vaas'}],
[{fullname:'akram'},
{fullname:'younis'},
{fullname:'akhamed'}]]
const res = arr.map((x, i) => [i + 1 ,...x.map(a => a.fullname)]);
console.log(res)

Answer 3

以下是动态标头大小的答案

const base = [
[{
fullname: 'sachin'
}, {
fullname: 'dravid'
}, {
fullname: 'ganguly'
}],
[{
fullname: 'pointhig'
}, {
fullname: 'mcrath'
}, {
fullname: 'warne'
}],
[{
fullname: 'sanath'
}, {
fullname: 'murali'
}, {
fullname: 'vaas'
}],
[{
fullname: 'akram'
}, {
fullname: 'younis'
}, {
fullname: 'akhamed'
}],
];
const result = base.map((x, xi) => [
xi + 1,
...x.map(y => y.fullname),
]);
result.unshift([
'Rank',
...[...Array(result[0].length - 1)].map(_ => 'Player'),
])
console.log(result);