I have an AntD table in ReactJS .I want to add some sorting on the columns.

I have tried the following:

    import { Card, Table as TableAnt } from 'antd';
       
    const columnscustomers = [       
    {
        title: 'Email',
        dataIndex: ['customer', 'email'],
        key: 'Email',
    },
    {
        title: 'First',
        dataIndex: ['customer', 'firstName'],
        key: 'First',
    },
    {
        title: 'Last',
        dataIndex: ['customer', 'lastName'],
        key: 'Last',
    },     


 <TableAnt dataSource={customers} columns={columnscustomers} 
 pagination={{ defaultPageSize: 5, showSizeChanger: true, pageSizeOptions: ['10', '20',   '30'] }}

I want to sort by email and First , I have tried putting

             sorter: (a, b) => a.email.localeCompare(b.email)
or 
             sorter: (a, b) => a.first.localeCompare(b.first)                                         

But it does nothing.

How can i put a sort on the columns ?