How to wrap whole row to React Router Link in antd - react-router

Question

I have a table and need wrap every table row to Link. How can I do that? I need that when I click on the row I go to another route. I’ve already figured out how to make a link every cell, but with the whole row I don’t know how to make
const AccountList = props => {
const columns = [
{
title: "Acc",
dataIndex: "fullName",
key: "fullName",
width: 170,
},
{
title: "Number",
dataIndex: "ID",
key: "ID",
width: 100
},
];
return (
<div style={{ margin: "15px" }}>
<Table
columns={columns}
dataSource={accInfoProps}
pagination={false}
size={"small"}
title={() => <h2 style={{ float: "left" }}>Список аккаунтов</h2>}
onRow={(record) => {
return {
onClick: () => {
console.log(record.id)
},
};
}}
/>
,
<Pagination
onChange={onChange}
style={{ float: "right", marginTop: "15px" }}
defaultCurrent={1}
total={500}
/>
</div>
);
};
export default AccountList;
Thanks in advance

Answer 1

Use onRow event handler on Table component to route to desired link onClick. If using react-router-dom, you can use the Redirect component to navigate to the new link.
<Table
onRow={(record, rowIndex) => {
return {
onClick: event => <Redirect push to={record.link}/>
};
}}