[material-ui][Select] Allow specifying which keydowns open the menu

x6yk4ghg  于 6个月前  发布在  其他
关注(0)|答案(2)|浏览(76)

重复

  • 我搜索了现有的问题

总结

如果开发者能够指定哪些按键打开菜单,而不需要拥有 SelectInput 否则在打开状态不受控制的情况下管理内部的所有权,那就太好了。

示例

  • 无响应*

动机

我们正在使用 Select 作为典型索引屏幕上的过滤器字段,并且我们已经训练过我们的用户使用 CMD/CTRL + Enter 键盘快捷键将当前的过滤值提交以执行搜索。
然而,当按下该快捷键并且 Select 有焦点或处于活动状态时,它的菜单将会打开。
Select 有焦点或处于活动状态时按下 Enter 确实会打开其菜单,但在 CMD/CTRL + Enter 的情况下,让它保持关闭会更好。
值得一提的是,当 Autocomplete 有焦点或处于活动状态时按下 CMD/CTRL + Enter 不会打开其菜单。
从更一般的Angular 来看,似乎有几个旧的、已关闭的问题讨论了事件传播和/或将事件处理的默认行为组合到自定义事件处理程序中的能力,但所有这些似乎都与 Autocomplete 有关:

也许与之相关的是 mui/mui-x#1403 特定于 DataGrid 引入的 defaultMuiPrevented,我猜想这最终导致了能够禁用默认行为。那里的动机可能与这里不同,但它似乎确实涉及到允许开发人员在没有完全放弃它并自己编写的情况下覆盖默认事件处理的情况。
我肯定没有你们必须做出最佳知情决策的上下文来最好地向 API 添加类似的东西,所以请将此建议仅视为另一种解释我想要做的方式。它似乎像这样来自 material-ui/packages/mui-material/src/Select/SelectInput.js
第309行到第325行 in 0d93e4a
| | consthandleKeyDown=(event)=>{ |
| | if(!readOnly){ |
| | constvalidKeys=[ |
| | ' ', |
| | 'ArrowUp', |
| | 'ArrowDown', |
| | // The native select doesn't respond to enter on macOS, but it's recommended by |
| | // https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/ |
| | 'Enter', |
| | ]; |
| | |
| | if(validKeys.indexOf(event.key)!==-1){ |
| | event.preventDefault(); |
| | update(true,event); |
| | } |
| | } |
| | }; |

eh57zj3b

eh57zj3b1#

请注意,我已更改问题标题和摘要,以更明确地描述所需的功能。
虽然通过其内部 handleKeyDown 实现的默认行为 composability(可组合性)对于 SelectInput 来说是很好的,但这会扩大我试图解决的实际问题的范围,即只需控制哪些按键打开菜单,而无需控制打开状态。

gpfsuwkq

gpfsuwkq2#

嘿,@steven-cole-elliott,感谢你的报告!
我添加了 waiting for upvotes 标签,以便社区可以为这个新功能投票。

相关问题