Base
WebReactAntd

Working with Antd Table

Columns width not working when there's fixed column

  • Resolution: make sure scroll.x is set to a certain number (not auto) AND make sure each column have defined width size.

Flexible Column Width

  • If all column need to be shown in screen but want a readable + scrollable table in mobile view (no need define width size for each column):
    • set scroll.x to certain width (following estimated overall column width) if the view width is mobile
    • else set scroll.x to auto / max-content

Virtual Table

  • scroll.x and scroll.y must be both defined and both set as number (not max-content or auto)
  • If there's rowSelection, checkbox column width must be defined through columnWidth.

https://ant.design/components/table#table-demo-virtual-list

Advanced Table References

Pagination Position

<Table<DataType>
        columns={columns}
        pagination={{ position: [top, bottom] }}
        dataSource={data}
      />

Previous

Working with Antd Form

Next

Miscellaneous

On this page