Object.keys() 返回在 Ant Design 表列渲染中不起作用

Question

I'm trying to render an Ant Design table featuring a people column which should look like this:

Adults: 2 Children: 3

Here's a sample dataSource object:

{
    id: 'KRO066',
    key: 'KRO066',
    date: '01/01/2020',
    people: { adults: 2, children: 3 },
    status: 'Confirmed',
    total: '563.25',
}

Here's the people column render function in my column object:

{
    title: 'People',
    dataIndex: 'people',
    key: 'people',
    render: people => Object.keys(people).forEach(function (type, i) {
        return <span key={i}><strong>{type}:</strong>{people[type]}</span>;
    })

}

The column does not return anything, instead, I get an empty cell.

What's wrong with the render function?

Answer 1

Use Object.keys(people).map instead of Object.keys(people).forEach

Credit @Hamms in the question comments