javascript - React 保持专注于Blur
问题描述
我有一个在和期间触发focus()
ref 组件的组件。此外,当我们在外部单击时,我还有不会触发 onClose 的功能。当我点击外部时,我再次触发以保持对元素的关注。最好的方法是什么?为什么在某些情况下我看到更好地使用 setTimeout onblur?componentDidMount
componentDidUpdate
onBlur
focus
export class Test extends Component {
componentDidMount = () => this.focusContainer()
componentDidUpdate = () => this.focusContainer()
container = React.createRef()
focusContainer = () => this.container.current.focus()
render = () => {
return (
<div
style={{outline: 'none'}}
onKeyPress={this.captureInput}
onBlur={this.focusContainer} // or onBlur={() => setTimeout(() => this.focusContainer(), 0) } - why ?
ref={this.container}
// tabIndex is needed for focus/blur to work on non input type elements.
tabIndex={0}
>
<img src={scanTag} style={{maxWidth: '100%'}} alt='scan tag via scanner' />
..........
</div>
)
}
}
解决方案
推荐阅读
- javascript - 从本地目录 React 中的文件夹导入文件
- intellij-idea - Rubymine:终止 STDIN 后无法从 STDOUT 读取
- c# - 可空外键上的级联删除
- html - 在 Flask 路由中使用变量时如何修复 CSS 404 错误
- java - 来自Spring Boot中函数参数的Concat @Query值
- python - 用于打印的 Python 字典键格式不适用于数字字符串
- c++ - 为什么在声明使用命名空间std时将int作为指针参数传递给函数?
- selenium - 如何获取一个文本带有子元素和直接文本的标签?
- node.js - 如何在 NodeJs 中更新 AWS DynamoDb?
- linux - 在 Linux 中查找已删除打开文件的大小?