头条前端面试题,vue 实现快捷键录入功能,前端程序员

);

});

},

immediate: true,

},

},

methods: {

handleFocus() {

if (!this.list.length) this.focus = true;

},

handleDeleteKey(index) {

this.list.splice(index, 1);

},

handleKeydown(e) {

const { altKey, ctrlKey, shiftKey, key, code } = e;

if (!CODE_CONTROL.includes(key)) {

if (!this.keyRange.includes(code)) return;

let controlKey = “”;

[

{ key: altKey, text: “Alt” },

{ key: ctrlKey, text: “Ctrl” },

{ key: shiftKey, text: “Shift” },

].forEach((curKey) => {

if (curKey.key) {

if (controlKey) controlKey += “+”;

controlKey += curKey.text;

}

});

if (key) {

if (controlKey) controlKey += “+”;

controlKey += key.toUpperCase();

}

this.addHotkey({

text: controlKey,

controlKey: { altKey, ctrlKey, shiftKey, key, code },

});

}

e.preventDefault();

},

addHotkey(data) {

if (this.list.length && this.list.some((item) => data.text === item.text))

return;

if (

this.list.length &&

this.list.length.toString() === this.max.toString()

)

return;

this.list.push(data);

},

},

};

  • 7
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值