How to use label in IconMenu

Question

I am using IconMenu with IconButton and Icon. I want to have a label just before 'NavigationExpandMoreIcon'.

Is it possible to achieve in this possible setup or do I need to change the components that I am using?

My Code looks like:

<IconMenu
            iconButtonElement={
              <IconButton touch>
                <NavigationExpandMoreIcon />
              </IconButton>
            }

            onItemClick={this.handleClick}
          >
            {options}
          </IconMenu>

I am using material UI 0.20 and React 16 I also have material ui 3.7 (So I can upgrade the component, if needed)

score 1 · Answer 1 · answered Mar 08 '19 at 05:33

I think you can customize using iconButtonElement options it is accept node..

<IconMenu
            iconButtonElement={
              <React.Fragment>
               //Use styles based on your need for label component...
               <label>Your Label here</label>
              <IconButton touch>
                <NavigationExpandMoreIcon />
              </IconButton>
              </React.Fragement>
            }

            onItemClick={this.handleClick}
          >
            {options}
</IconMenu>

How to use label in IconMenu

1 Answers1