如何在material-ui中的MenuItem上设置焦点

Posted 2023-02-22

【中文标题】如何在material-ui中的MenuItem上设置焦点

【英文标题】：How to set focus on a MenuItem in material-ui

【发布时间】：2017-05-28 04:39:29

【问题描述】：

我正在尝试以编程方式将焦点设置在（激活）material-ui 中的 Menu 组件内的一个 MenuItem 上。我可以通过按选项卡手动执行此操作，但我需要以编程方式执行此操作以响应按键事件。

<Menu disableAutoFocus=true>
   <MenuItem .../>
   <MenuItem .../>
   ...
</Menu>

【问题讨论】：

这可能有用***.com/a/37964596/1908184

【参考方案1】：

您是指以编程方式选择 menuItem 吗？如果是这样，您可以使用“受控组件”的概念。

这是一个例子， 如果 this.state.selectedItem = 1，将选择项目“地图”。 如果 this.state.selectedItem = 2，则将选择“书籍”项。

  <Menu
    selectedMenuItemStyle= backgroundColor: '#c00', color: '#FFFFFF' 
    value=this.state.selectedItem
    >
      <MenuItem primaryText="Maps" value='1'/>
      <MenuItem primaryText="Books" value='2' />
  </Menu>