Блог

Главная - Вопросы по программированию - Как использовать label в IconMenu

Как использовать label в IconMenu

#reactjs #material-ui #iconmenu

#reactjs #материал-пользовательский интерфейс #iconmenu

Вопрос:

Я использую IconMenu с IconButton и значком. Я хочу иметь label непосредственно перед ‘NavigationExpandMoreIcon’.

Возможно ли достичь этого при такой возможной настройке или мне нужно изменить компоненты, которые я использую?

Мой код выглядит следующим образом:

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

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

Я использую material UI 0.20 и React 16
У меня также есть material ui 3.7 (Так что я могу обновить компонент, если это необходимо)

Ответ №1:

Я думаю, вы можете настроить, используя параметры iconButtonElement, это принимающий узел..

 <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>