如何在Material UI Select字段上以编程方式触发focus()?

时间:2017-11-17 14:50:32

标签: reactjs material-ui

我的应用程序表单利用输入按钮在十键键盘上选择指定字段以提高速度。当命中输入时,我们进行DOM查找并在下一个元素上触发focus()。这在文本字段上很有用,但我无法理解如何在Material UI Beta@1.0.0-beta.21的Select框中完成此操作。我可以获得组成Select结构的每个DOM元素,但在任何级别触发focus()都不会做任何事情。 注意:我能够通过select上的inputRef来获取项目的引用,以防止我们遍历DOM,但它仍然没有产生任何结果。

关于GitHub的问题:https://github.com/callemall/material-ui/issues/9182#issuecomment-345148074

Code Sandbox示例:https://codesandbox.io/s/m43qqyo2zy

1 个答案:

答案 0 :(得分:4)

传递给node的{​​{1}}引用了隐藏的Select.props.inputRef()。您需要在inputfocus()呈现为其兄弟。此外,您需要先div处理Select元素案例,因为handleKeyPressInternal()将返回getElementsByName()

但是,这感觉不对,因为您依靠input将焦点Select渲染为其直接的兄弟姐妹。可以在div上扩展inputRef()以返回可以直观获得焦点的节点。

https://codesandbox.io/s/zooz41oo3