javascript 如何防止使用键盘时出现默认的PrimeNg p树行为?

w6mmgewl  于 2022-12-25  发布在  Java
关注(0)|答案(1)|浏览(110)

我将 p-tree 组件与“checkbox”selectionMode 一起使用。我希望实现我的机制,而不是默认的键盘操作(使“space”键选中复选框,禁用处理“enter”和箭头键)。我尝试了此事件侦听器”

const treeNodes = this.document.querySelectorAll('.p-treenode-selectable');
treeNodes.forEach((node) => {
    this.globalListenFunc = this.renderer.listen(
    node,
    'keypress',
    (e) => {
        e.preventDefault();
        if (e.code === 'Space') {
            (node as HTMLElement).click();
        }
     });
});

但是它不能捕获“enter”和箭头键(我猜 p-tree 以某种方式停止了事件的传播)。我该如何改变它呢?或者有没有其他方法来实现我的自定义键盘机制?

wwtsj6pe

wwtsj6pe1#

尝试覆盖默认的TreeNode onKeyDown原型事件,如下所示

UITreeNode.prototype.onKeyDown = function (e) {
  e.preventDefault();
  if (e.code === 'Space') {
    this.tree.onNodeClick(e, this.node);
  }
  console.log('Override default on keydown event');
};

演示here

相关问题