资料-ui:警告:未知事件处理程序属性‘`onKeyboardFocus`’。它将被忽略

Question

更详细的跟踪：

warning.js:33 Warning: Unknown event handler property `onKeyboardFocus`. It will be ignored.
    in div (created by IconMenu)
    in div (created by IconMenu)
    in IconMenu (created by DropdownMenu)
    in div (created by DropdownMenu)

我有一个IconMenu和一个IconButtonElement道具。出于某种原因，它一直在发出警告。为什么？那是什么？

触发的示例代码是：

<IconMenu
    iconButtonElement={
        <div>
            <IconButton onClick={this.handleTouchTap}>
                <div >
                    <img src={require("../../settingsicon.svg")}/>
                </div>
            </IconButton>
        </div>}
    open={this.state.open}
    anchorOrigin={{horizontal: "right", vertical: "bottom"}}
    targetOrigin={{horizontal: "right", vertical: "top"}}
>
    <MenuItem
        className={someClass}
        onClick={this.handleLogOutClick}
    >
        <span className={someClass}Hello</span>
    </MenuItem>
    <Divider className={someClass}/>
    <MenuItem className={someClass}>
        <span className={someClass}>Goodbye</span>
    </MenuItem>
</IconMenu>

这是一个非常简单的例子，它几乎是从带有一些函数的文档中粘贴到菜单项中的，但是不应该抛出像这样的错误。即使我做了一个完整的巴黎人的例子-它仍然抛出警告。每次页面加载时，控制台中的内容都有点难看:)

Answer 1

IconMenu将onKeyboardFocus支柱传递给在iconButtonElement中定义的元素，如果它是一个React组件(如医生们建议的那样，它是一个反应组件)，那么这个警告就会发生，因为您已经将它包装在div中，并且onKeyboardFocus不是一个受支持的DOM事件(它是IconButton API中的一个属性)。

您应该删除iconButtonElement中的外部div。

onKeyboardFocus默认为非op函数，并且无条件地传递.由于您没有将其指定为IconMenu的支柱，所以如果您删除iconButtonElement中的包装div，效果将是相同的:它将什么也不做，但是警告将不再发生。

如果您使用的是onKeyboardFocus道具，那么删除div或者用将该道具传递给它的子组件的另一个组件来替换它将是确保它到达IconButton的唯一方法。

我不会提出任何问题，因为一对夫妇已经提交并结束了：

• #6056
• #5071