聚焦 v-textarea 时快捷方式不起作用答案

【问题标题】：Shortkey doesn't work when v-textarea is focused聚焦 v-textarea 时快捷方式不起作用
【发布时间】：2022-12-18 08:44:05
【问题描述】：

我有一个小问题。一旦文本区域获得焦点，就无法在按钮上执行快捷键（插件）。

... => 不相关的内容

<template>
    <div>
        <v-textarea ... />
        <div>
            <v-btn
             v-shortkey="['esc']"
             @shortkey="abort"
            >
            ...
            </v-btn>
             <v-btn
              v-shortcut="['alt', 'enter']"
              @shortkey="confirm"
             >
             </v-btn>
        </div>
    </div>
</template>

<script>
    methods: {
        abort() {
            console.log('aborted')
        }

        confirm() {
            console.log('confirmed')
        }
    }
</script>

当您集中注意力时，这两种方法都不会执行。有人有解决办法吗？

如果您单击“alt”和“enter”，我想执行确认方法，甚至专注于文本区域。如果您单击“esc”，我想执行中止方法，甚至专注于文本区域。

【问题讨论】：

标签： javascript vue.js frontend keyboard-shortcuts

【解决方案1】：

一种方法是在组件的 js 部分添加一个事件侦听器。

This 将捕获键盘上按下的所有键，您可以使用事件附带的参数检查按下了哪个键。

警告这不仅会在关注按钮/文本区域时收听所有按键。

【讨论】：