Quill:如何处理自定义印迹上的键盘事件

Question

我已经创建了自定义的内联印迹，并希望在其上处理键盘事件。

在constructor，我编写了这样的代码：

class FooBlot extends Inline {
  constructor(domNode, value){
    super(domNode, value);
    domNode.addEventListener('keydown', (event) => {this.keydown_handler(event)});
    domNode.addEventListener('click', (event) => {this.click_handler(event)});
  };

当我尝试对我的印迹膜做某事时，只处理了点击事件，而不是键控事件。

您可以在此处查看代码示例。打开控制台，单击一些文本，您将在控制台中看到"单击"。但是，如果您尝试按下某些键盘按钮，例如箭头，您将看不到任何内容。

处理自定义印迹上的键盘事件的正确方法是什么？

Answer 1

处理键盘事件的正确方法是使用键盘模块

处理Enter键的简单示例：

const bindings = {
  enter: {
    key: 13,
    shiftKey: null,
    handler: (range, context) => {
      // Handle enter
    }
  }
};
this.quill = new Quill('#editor-container', {
  modules: {
    keyboard: {
      bindings
    },
    toolbar: '#toolbar'
  },
  theme: 'snow'
});

更新

另一种方式：

quill.root.addEventListener('keydown', evt => { // Your code goes here });