基于 OR 运算符的 React 渲染

问题描述 投票:0回答:1

我正在创建一个菜单,根据用户角色显示项目。

有些项目必须显示角色是 A 还是 B,但我无法做到这一点。

代码示例:

      {
       (this.props.currentUser.role === 'admin') || ( this.props.currentUser.role === 'contra')  &&
        <Dropdown item text='ADMIN'>
          <Dropdown.Menu>
            {
              this.props.currentUser.role === 'admin' &&
            <div>
              <Dropdown.Item>
                <Link to="/companies/list">Companies</Link>
              </Dropdown.Item>
              <Dropdown.Item>
                <Link to="/obs-report">Obs Report</Link>
              </Dropdown.Item>
            </div>
            }
            <Dropdown.Item>
              <Link to="/users/list">Users</Link>
            </Dropdown.Item>
          </Dropdown.Menu>
        </Dropdown>
      }

这仅正确显示“contra”角色的项目,不确定为什么不能与“admin”角色一起使用。

也尝试过这个,但没有成功:

this.props.currentUser.role === ('admin' || 'contra')
javascript reactjs conditional-statements
1个回答
10
投票

忘记包裹:)

((this.props.currentUser.role == 'admin') || ( this.props.currentUser.role == 'contra'))  &&

希望它对某人有帮助

谢谢!

© www.soinside.com 2019 - 2024. All rights reserved.