React.js - LinkContainer。防止链接导航

Question

基本上我想做的事情应该很简单：）

我在菜单中有两个链接，Link1和Link2。

Link1有一个复选框。如果没有选中复选框，我需要阻止导航到Link2。

内部＆lt;导航＆gt;我有这段代码：

 <LinkContainer activeClassName='active'
                       to={{pathname: '/cleanup/manual/' + this.state.ProjectId, query: {productIds: this.state.ProductIDs.join()}}}><NavItem
          eventKey={3} onClick={ this.onNavItemClick }title='Sop'>Link2</NavItem></LinkContainer>

当鼠标悬停时，链接结构如下（未选中复选框）：

http://localhost:3000/#/cleanup/manual/39?productIds=

当我选择了一些复选框时：

http://localhost:3000/#/cleanup/manual/39?productIds=62%2C63

我可以访问我可以看到的状态，如果我选择了ProductIDs，这就是我尝试这样做的方式：

handleSelect(event) {   
if (event === 3 && this.state.ProductIDs.length === 0) {
    NotificationManager.warning('Please select some products');
    this.setState({activeKey: 0});
    return;
}



this.setState({activeKey: event});
},

如果语句工作得很好，但它总是导航到Link2页面。如何防止它在那里导航？

Answer 1

您希望e.preventDefault()中的onNavItemClick阻止发生默认功能。