Горячие клавиши - js - Как мне отменить привязку к горячим клавишам? - PullRequest
Новая
       10

Горячие клавиши - js - Как мне отменить привязку к горячим клавишам?

0 голосов
/ 24 января 2020

Я использую hotkeys-js и bind Enter, что вызывает функцию Отправить и закрыть диалог. Закрывая, я пытаюсь отсоединить мою горячую клавишу, но моя горячая клавиша постоянно связана. Я также пытался unbound как handleHotkey: Function = event => hotkeys.unbind('Enter', this.handleHotKey) && this.handleSubmit() 

import React, { Component } from 'react'

export default class Basis extends Component {
  state = {
    open: true,
  }

  handleClose: Function = () => {
    this.setState({ open: false })
  }

  render() {
    const { open } = this.state

    return (
      <>
        {open && <Dialog onClose={this.handleClose}/>}
      </>
    )
  }
}


// @flow
import React, { Component } from 'react'
import hotkeys from 'hotkeys-js'

export default class Dialog extends Component {
  componentDidMount () {
    hotkeys('Enter', this.handleHotkeys)
  }

  componentWillUnmount () {
    hotkeys.unbind('Enter', this.handleHotkeys)
  }

  handleHotkey: Function = event => this.handleSubmit()

  handleSubmit: Function = () => {
    console.log(12)
  }

  render () {
    return (
      <>
        <button onClick={this.handleSubmit}>Submit</button>
      </>
    )
  }
}

1 Ответ

0 голосов
/ 24 января 2020

Возможно, компонент не будет размонтирован. Попробуйте отсоединить его с помощью метода onSubmit 

handleSubmit: Function = () => {
    console.log(12);
    hotkeys.unbind('Enter');
  }

Но если вы хотите управлять горячими клавишами после объявления, лучше использовать setScope 

setScope
Use the hotkeys.setScope method to set scope. There can only be one active scope besides 'all'. By default 'all' is always active.

// Define shortcuts with a scope
hotkeys('ctrl+o, ctrl+alt+enter', 'issues', function(){
  console.log('do something');
});
hotkeys('o, enter', 'files', function(){ 
  console.log('do something else');
});

// Set the scope (only 'all' and 'issues' shortcuts will be honored)
hotkeys.setScope('issues'); // default scope is 'all'
getScope
Use the hotkeys.getScope method to get scope.

hotkeys.getScope();
deleteScope
Use the hotkeys.deleteScope method to delete a scope. This will also remove all associated hotkeys with it.

hotkeys.deleteScope('issues');
...