Antd UI library. Overriding <Table /> behavior on empty data

Question

I want to render some other content if <Table /> receives empty data Array.
Currently its just showing 'No data', but I want to put some custom component there.

How this may be done?

Answer 1

There is a property of table, locale. This is an object, used to define following things:

filterConfirm, filterReset, emptyText.

Use emptyText to specify the text that you want to show if data is empty. Like this:

let locale = {
  emptyText: 'Abc',
};

<Table locale={locale}  dataSource={dataSource} columns={columns} />

Check the Doc: https://ant.design/components/table/