使用pro-components遇到的问题

使用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>
      )
    },
相关推荐
徐小夕@趣谈前端7 分钟前
Web文档的“Office时刻“:jitword共建版2.0发布!让浏览器变成本地生产力
前端·数据结构·vue.js·算法·开源·编辑器·es6
m0_561359679 分钟前
使用Python处理计算机图形学(PIL/Pillow)
jvm·数据库·python
山岚的运维笔记13 分钟前
SQL Server笔记 -- 第14章:CASE语句
数据库·笔记·sql·microsoft·sqlserver
Data_Journal19 分钟前
如何使用 Python 解析 JSON 数据
大数据·开发语言·前端·数据库·人工智能·php
德育处主任Pro19 分钟前
纯前端网格路径规划:PathFinding.js的使用方法
开发语言·前端·javascript
ASS-ASH22 分钟前
AI时代之向量数据库概览
数据库·人工智能·python·llm·embedding·向量数据库·vlm
墨笔.丹青26 分钟前
基于QtQuick开发界面设计出简易的HarmonyUI界面----下
开发语言·前端·javascript
董世昌4142 分钟前
深度解析浅拷贝与深拷贝:底层逻辑、实现方式及实战避坑
前端·javascript·vue.js
扶苏10021 小时前
vue使用event.dataTransfer实现A容器数据拖拽复制到到B容器
前端·vue.js·chrome
xixixi777771 小时前
互联网和数据分析中的核心指标 DAU (日活跃用户数)
大数据·网络·数据库·数据·dau·mau·留存率