如何在 material-ui 1.0 中添加指向列表的链接？

Question

以下与 onClick 动画混淆（ListItem 变为红色）：

 <List>
  <a href="https://www.google.com">
    <ListItem button>
       <ListItemText primary="Google" />
     </ListItem>
   </a>
 </List>

在 ListItem 中添加链接时，仅在单击 ListItemText 时才使转换起作用，这不是我想要的。添加链接的正确方法是什么？

原文由 Luis F. 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

完成此操作的最简单方法是使用 component 属性使 ListItem 成为链接：

 <List>
  <ListItem button component="a" href="https://www.google.com">
    <ListItemText primary="Google" />
  </ListItem>
</List>

这样， ListItem 将是链接到所需位置的锚标记，但仍会接收适当的样式，因此不会有任何视觉变化。

component 道具的行为记录 在这里。请注意， href 道具将自动传递给锚标签，如道具文档中的最后一行所指定：

提供的任何其他属性都将传播到根元素。

原文由 Jules Dupont 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

与“react-router-dom”一起使用

import { Link } from "react-router-dom";
<ListItem button component={Link} to="/design">

该示例基于本节： docs

原文由 Julian Botia 发布，翻译遵循 CC BY-SA 3.0 许可协议