Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Radio]希望能给fusion的某些组件加上focus的方法和绑定onKeyDown事件 #4461

Closed
gogocrow opened this issue Oct 10, 2023 · 5 comments
Assignees
Labels
💡 Feature Request New feature or request Next release issues to close in next release

Comments

@gogocrow
Copy link
Contributor

Component

Radio

Feature Description

背景:
示例代码在这里:
https://codesandbox.io/s/silly-tess-8gg63p?file=/src/App.js
在这里我们希望实现类似一个键盘表格编辑功能,在页面初始化的时候,焦点在第一行第一列的input上,当键盘上输入回车时,可以跳到第二行第一个input上。当键盘按下tab时,焦点要跳到第一行的radio group上。
现在的问题是radio group并没有所谓的focus方法,导致无法将焦点放在radio上,因此这个功能在radio等组件上无法实现。

诉求:给radio group加上类似focus这样的方法,当这个方法被调用时,可以是这个radio的第一个选中的组件获得focus焦点,可以做相应的键盘操作,也可以响应外部的键盘事件的绑定。

@fusion-design-bot fusion-design-bot self-assigned this Oct 10, 2023
@eternalsky eternalsky added the 💡 Feature Request New feature or request label Oct 11, 2023
@eternalsky
Copy link
Contributor

ok,也就是提供一个 focus 方法,使其可以正常的进行组件的键盘操作

@gogocrow
Copy link
Contributor Author

目前看来是的,RadioGroup可以绑定onKeyDown。

@eternalsky
Copy link
Contributor

目前看来是的,RadioGroup可以绑定onKeyDown。

我觉得,那可以按照这个思路,来 pr 一下吗?radio group focus 时聚焦到第一个 item,这样就可以继续键盘操作了。选中有点不太对,因为有可能没有选中的。

@gogocrow
Copy link
Contributor Author

目前看来是的,RadioGroup可以绑定onKeyDown。

我觉得,那可以按照这个思路,来 pr 一下吗?radio group focus 时聚焦到第一个 item,这样就可以继续键盘操作了。选中有点不太对,因为有可能没有选中的。

我试了下浏览器自带radio的逻辑,当按tab的时候,焦点会优先落在group中选中的radio上,然后才是第一个/最后一个。所以,还是建议和浏览器自带的逻辑对齐,在有选中的情况下focus选中的那个。

@eternalsky
Copy link
Contributor

目前看来是的,RadioGroup可以绑定onKeyDown。

我觉得,那可以按照这个思路,来 pr 一下吗?radio group focus 时聚焦到第一个 item,这样就可以继续键盘操作了。选中有点不太对,因为有可能没有选中的。

我试了下浏览器自带radio的逻辑,当按tab的时候,焦点会优先落在group中选中的radio上,然后才是第一个/最后一个。所以,还是建议和浏览器自带的逻辑对齐,在有选中的情况下focus选中的那个。

这样也可以,但正常来说,我觉得应该是 follow 在 radio 组上的时候,就可以直接利用到浏览器自带的特性了。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
💡 Feature Request New feature or request Next release issues to close in next release
Projects
None yet
Development

No branches or pull requests

3 participants