如何通过材质UI将tabIndex添加到MenuItem中

Question

我在Material UI中使用MenuItem来显示供用户选择语言的列表。

为了获得可访问性，我需要用户能够在列表中浏览并选择一个，但是它正在跳过此列表并转到DOM中的下一个elemend。

    <MenuItem
        tabIndex="0"
        className="menu-item"
        key={key}
        selected={i18n.language === key}
        onClick={() => {
            handleLanguageChange(key);
                }}
            >
            <ListItemText tabIndex="0" primary={languages[key]} />
            <ListItemIcon className="icon">
                <CheckCircleIcon className={'checkmark'} fontSize="small" />
            </ListItemIcon>
    </MenuItem>

屏幕快照来自开发人员工具，并显示了标签索引，但似乎可能需要在<li>内的子元素上。

是否有其他方法可以使tabIndex正常工作？

Answer 1

显示出需要添加到列表上方的元素。tabindex="-1"