阿凡达是具有状态的Material-UI-React组件

时间:2018-09-27 17:49:37

标签: reactjs redux state material-ui

我想将头像作为元素放置在Material-UI-Appbar中。该头像将获取LoggedIn用户信息,具体地说,这是第一个字母。并显示它。到目前为止,尽管已在另一个组件中,但我已经完成了。

这是代码:

<CardHeader
avatar={<Avatar>{this.props.data.user.first_name.charAt(0)}</Avatar>}
/>

现在,我想在导航栏组件中复制此逻辑。两个小渔获。

  1. 我只想在用户登录时显示头像。使用三元运算符和redux操作isAuthenticated完成了该操作。

            <AppBar
              title="Lenses - Secure Area"
              showMenuIconButton={false}
              iconElementRight={
                  this.props.isAuthenticated ? <FlatButton label="Logout" onClick={(e) => this.logout(e)} /> : ''}/>
    
  2. 我希望头像为下拉列表。无论我做什么,似乎都行不通。

您能帮我提供Avatar Dropdown的代码吗?我认为Aft4er可以将它们拼凑在一起。

我正在使用React 15.1以及Material-UI-React 0.20。感谢您的宝贵时间。

0 个答案:

没有答案