覆盖输入框的焦点触发器

【问题标题】：override focus trigger for input box覆盖输入框的焦点触发器
【发布时间】：2020-06-04 21:08:08
【问题描述】：

正如您在下面的 gif 中看到的那样，trello 的列表标题是在点击时获得焦点的输入框，但如果您长按则不会获得焦点。如何实现此功能？我正在使用 react，所以没有 jquery，但是 vanilla js 很好，谢谢

【问题讨论】：

【解决方案1】：

长按

class App extends Component {
  constructor() {
    super()
    this.handleButtonPress = this.handleButtonPress.bind(this)
    this.handleButtonRelease = this.handleButtonRelease.bind(this)
  }
  handleButtonPress () {
    this.buttonPressTimer = setTimeout(() => alert('long press activated'), 1500);
  }

  handleButtonRelease () {
    clearTimeout(this.buttonPressTimer);
  }

  render() {
    return (
      <div 
          onTouchStart={this.handleButtonPress} 
          onTouchEnd={this.handleButtonRelease} 
          onMouseDown={this.handleButtonPress} 
          onMouseUp={this.handleButtonRelease} 
          onMouseLeave={this.handleButtonRelease}>
        Button
      </div>
    );
  }
}

原文：react long press event

【讨论】：