我正在使用 Material UI Datagrid 来显示一些数据。 其中一列显示一个链接,可在另一个选项卡中打开 URL。 在单击的行上,我想导航到另一个页面,但在单击链接时我不想导航到另一个页面。
我可以简单地禁用链接整个单元格上的点击行为,但这并不是完全理想的。您是否知道一种解决方案,可以以某种方式阻止从链接的 onClick 内执行 onRowClicked ?
我正在使用的简化示例:
<DataGrid
columns={[
{ flex: 200, field: 'name', headerName: 'Naam' },
{
flex: 250,
field: 'url',
headerName: 'Link',
renderCell: (cell: GridCellParams) => (
<Box width="100%" overflow="scroll">
<Link
href={cell.value}
target="_blank"
>
Click here
</Link>
</Box>
),
},
]}
onRowClicked={(row) => {
navigate(Routes.OTHER_PAGE.replace(':id', row.id))
}}
rows={rows}
/> Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
将
onClick={(event) => event.stopPropagation()}添加到链接即可解决此问题。