Table组件服务端渲染

[geekpeng]

Which Component Need Enhancement 期望新增功能的组件

• Table 支持 nextjs 后端渲染问题

What does the proposed API look like 期望支持的API

Feature Description 功能描述

nextjs 在使用table 组件的时候 通过url访问服务端渲染的时候 Table 组件数据不会在服务端口渲染
不知道是否是因为需要做一些样式的自适应没有实现服务端口渲染

自己手写的table 会渲染 List 组件也会渲染

因为 table 中返回的数据会有 href 需要做 seo优化

Additional information 补充说明

部分代码

export default function Home({coinMarkets}) {

  const { t } = useTranslation('nav');

  coinMarkets = [{
    symbol:"123",
    price:"12323"
  },
  {
    symbol:"1234",
    price:"12323"
  },
  {
    symbol:"1235",
    price:"12323"
  },
  {
    symbol:"1236",
    price:"12323"
  }]
  let data_node =  (
    <table>
      {coinMarkets.map(item=>{

        return (<tr><td>{item.symbol}</td><td>{item.currentPrice}</td></tr>)
      })}
    </table>
  )

  const router = useRouter();
  const {locale} = router;

  const columns = [{
      title:"symbol",
      dataIndex:'symbol',
      key:"symbol"
    },
    {
      title:"price",
      dataIndex:'currentPrice',
      key:"currentPrice"
    } ]

  return (
    <div>

          <List
              header={<div>Header</div>}
              footer={<div>Footer</div>}
              bordered
              dataSource={coinMarkets}
              renderItem={item => <List.Item>{item.symbol}</List.Item>}
          />
      <Button>主要按钮</Button>
      {data_node}
      <div>{t('blog')}</div>
      <Table columns={columns} dataSource={coinMarkets} rowKey={record=>record.symbol} />
    </div>
  )
}

页面返回 其中红色部分为Table组件渲染的结果

[shijiatongxue]

你好，Table 目前不支持 SSR，有打算修复。

这里应该没有特别的考虑，这是一个 Bug。

[shijiatongxue]

v2.34.0 fixed