如何为使用React的onClick=""而不是hrefa""的:visited元素设计样式

该网站有一个表。在表中，我从Firestore获取数据（并向用户显示这些数据）。表格中的一些单元格可能会链接到网站上的其他页面（这些页面也被实现为一个表格）。

由于有很多信息，用户可能会混淆哪些链接是他跟踪的，哪些是他没有接触的。因此，我想在悬停在那些用户已经访问过的链接上时，用不同的颜色来标记。

默认情况下，我的链接颜色是黑色，如果你把鼠标悬停在链接上，它就会亮起蓝色。我希望用户访问过的链接能以不同的颜色突出显示。

有趣的是，从互联网上的许多选项中，我没有找到一个适合我的选项。也许是因为我使用Firestore作为数据库，所有东西都是以JSON格式存储的？

下面是我写路由的一个例子

export default function DeviceCell({ device }) {
const router = useNavigate()

return (
    <TableRow>
      
        <TableCell>
            <a className="page-links" onClick={() => router(device.id)}>List of users</a>
        </TableCell>
    </TableRow>
);

}

还有我的.css文件

.page-links{
    text-decoration: none;
    border-bottom: 1px black solid;
    border-bottom-width: 2px;
    color: #3A3A3F;
    cursor: pointer;   
}

.page-links:hover{
    color: #485FED;
    border-bottom: 1px #485FED solid;
    border-bottom-width: 2px;
}