使用ProTable组件进行数据渲染遇到的复杂数据结构如何处理?
参照官方文档:ProComponents官网
javascript
{
title: 'sku信息',
ellipsis: true,
search: false,
width: 160,
dataIndex: 'skus',
render: (_, record: any, dom) => (
<Space>
{record.skus.map((item) => (
<List>
<List.Item key={item.goods_sku_id}>
<List.Item.Meta
avatar={
<Image width={50} height={50} src={item.spu_img_head} />
}
title={
<>
<a style={{ marginRight: 15 }}>{item.spu_name}</a>
{
item.sku_attrs.map((attr, index1) => (
<Tag key={attr.value}>
{attr.value}
</Tag>
))
}
</>
}
description={
<>
<Text type="secondary" ellipsis={true} copyable style={{ fontSize: 12, display: 'block' }}>SKU名称:{item.sku_name}</Text>
<Text type="secondary" ellipsis={true} copyable style={{ fontSize: 12, display: 'block' }}>SKU数量:{item.num}</Text>
<Text type="secondary" ellipsis={true} copyable style={{ fontSize: 12, display: 'block' }}>SKU价格:{item.price}</Text>
</>
}
/>
</List.Item>
</List>
))}
</Space>
)
},