Question

我正面临这个问题，在选择react-bootstrap NavDropdown的MenuItem子链接时，NavDropdown标题未设置为活动状态。

我的NavDropDown代码：

    public Object dialog()
{
    DialogGroup     dialogGroup;
    ;
    dialogRunbase = super();
    dialogGroup = dialogRunbase.addGroup();
    dialogGroup.caption("CaptionLabel");
    dialogReasonId  = dialogRunbase.addFieldValue(this.reasonId(), "Label1","Label2");
    return dialogRunbase;
}

路线

  <NavDropdown eventKey={4} title="Manage User" id="basic-nav-dropdown">
    <LinkContainer to="/users/add">
      <MenuItem eventKey={4.1}>Add User</MenuItem>
    </LinkContainer>
    <IndexLinkContainer to="/users">
      <MenuItem eventKey={4.2}>View User</MenuItem>
    </IndexLinkContainer>
  </NavDropdown>

即使在路由和选择了MenuItem之后，NavDropDown标题“管理用户”也从未设置为活动状态。

Answer 1

我也遇到了类似的问题，我这样解决了。

您需要在list.stream().map(A::getNumber1);上定义number2道具，此值activeKey这将决定哪个链接有效。

<Nav >

希望这会对你有所帮助。

Answer 2

我解决了这个问题：

第一步。我在组件状态中声明了activeKey，它将决定哪个NavDropDown处于活动状态

 constructor(props) {
    super(props);
    this.state = { activeKey: 1 };
 }

第二步。用于处理onSelect事件的事件处理函数。获取事件键截断它并将其设置为'activeKey'状态

 handleSelect = (key) => {
    this.setState({ activeKey: Math.trunc(key) });
 }

第三步。调用上面的函数onSelect of Nav并将'activeKey'值传递给activeKey属性：

<Nav 
  activeKey={this.activeKey} 
  onSelect={this.handleSelect}> 
</Nav>

它完美无缺。

当MenuItem子链接处于活动状态时，NavDropdown未设置为活动状态

2 个答案: