javascript - React Router Link中的Material-UI组件触发链接

我在反应路由器中使用material-ui组件。我想显示应该用作链接元素的列表项时遇到问题，但其中包含一个子菜单，该子菜单不应触发父链接。它可以，我不知道如何禁用它。

var iconMenu =
    <IconMenu iconButtonElement={<IconButton><MoreVertIcon /></IconButton>}>
      <MenuItem primaryText='change name' onTouchTap={this.edit}/>
      <MenuItem primaryText='delete' onTouchTap={this.delete} />
    </IconMenu>


<ListItem
          key={i}
          containerElement={<Link to={`/items/${item.id}`} />}
          rightIconButton={iconMenu}
/>

当我单击iconMenu按钮时，我不希望触发<Link to={`/items/${item.id}`} />，因此我留在页面中。但是确实如此。那我该如何解决这个问题呢？我试图添加事件处理程序以运行stopPropagation()，但未成功...

谢谢！

最佳答案

对于React Router v4，添加

onTouchTap={() => this.props.history.push(`/items/${item.id}`)}

到ListItem，而不是containerElement。

使用import { withRouter } from 'react-router-dom'和export default withRouter(Foo)将history添加到组件的道具中。