使用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>
      )
    },
相关推荐
渐暖°5 分钟前
JDBC直连ORACLE进行查询
数据库·oracle
萧曵 丶29 分钟前
Next-Key Lock、记录锁、间隙锁浅谈
数据库·sql·mysql·mvcc·可重复读·幻读
han_1 小时前
从一道前端面试题,谈 JS 对象存储特点和运算符执行顺序
前端·javascript·面试
aPurpleBerry1 小时前
React 01 目录结构、tsx 语法
前端·react.js
jayaccc1 小时前
微前端架构实战全解析
前端·架构
做cv的小昊1 小时前
【TJU】信息检索与分析课程笔记和练习(7)数据库检索—Ei
数据库·笔记·学习·全文检索
qingyun9891 小时前
Web Components 实战:创建自定义比例条组件
前端
前端小超超1 小时前
ionic + vue3 + capacitor遇到backButton问题
前端·javascript·vue.js
zgl_200537791 小时前
ZGLanguage 解析SQL数据血缘 之 标识提取SQL语句中的目标表
java·大数据·数据库·数据仓库·hadoop·sql·源代码管理
GIS之路1 小时前
GDAL 空间关系解析
前端