一些关键事件阻止其他事件触发

Question

首先，这是我正在研究的实时应用程序：turbo_synth

我正在使用 VueJS 制作它，但是，我相信这个问题与 Vue 无关。

问题： 除了尝试弹奏某些音符组合（例如，尝试弹奏 Q、W 和 2 键）之外，一切都很好，而且很花哨。你会注意到最后一个音符没有被弹奏，甚至没有显示为按下，而您可以同时播放 Q、W、E、R 和 Y。所以它似乎没有限制，就像我之前想的那样？

代码：我正在使用 vue-keypress 来轻松处理全局的关键事件。

模板部分

<template>

    <div id="app">

        <h1>Basic oscillator test</h1>

        <label for="waveType">Choose a wave type:</label>

        <select

            name="waveType"

            id="waveType"

            v-model="wave"

        >

            <option value="sine">sine</option>

            <option value="square">square</option>

            <option value="triangle">triangle</option>

            <option value="sawtooth">sawtooth</option>

        </select>

        <hr>

        <ul class="keyboard">

            <li

                v-for="note in testBoard"

                :key="note.id"

                :class="[note.class, getKeyByValue(testBoard, note).charAt(0), {'pressed': pressedNotes.includes(note.freq)}]"

                @mousedown="playSound(note.freq, 1)"

            >

                <p>{{getKeyByValue(testBoard, note).replace('s', '#')}}</p>

                <p>{{String.fromCharCode(note.keycode)}}</p>

            </li>

        </ul>

        <Keypress

            v-for="note in testBoard"

            :key="note.id"

            key-event="keydown"

            :key-code="note.keycode"

            @success="playSound(note.freq)"

        />

        <Keypress

            v-for="note in testBoard"

            :key="note.id"

            key-event="keyup"

            :key-code="note.keycode"

            @success="removeNote(note.freq)"

        />

    </div>

</template>

脚本部分：

<script>

import { noteValues, testBoard } from './assets/notevalues.js';

export default {    name: 'App',

    data() {

        return {

            noteValues,

            testBoard,

            selectedNote: null,

            wave: 'sine',

            pressedNotes: [],

        }

    },

Answer 1

您的代码没有任何问题，您也无法修复它——这是许多键盘的硬件限制。首先，想象一下键盘布局为一个矩形网格（换句话说，1、Q、A和Z位于同一列中，即使它们通常不在彼此正上方）。限制是不能同时识别形成矩形三个角的三个键。如果您连续按住两个键，则第三个键不能与前两个键中的任何一个位于同一列。如果您在一列中按住两个键，则第三个键不能与前两个键中的任何一个在同一行。如果按住Qand&nbsp;Z，那么以 开头的行上的任何键A都可以正常工作，但是W,&nbsp;E,&nbsp;X,C等都将被锁定。或者，某些机器可能会在矩形的第四个角处为您提供“幽灵”按键——按住Q并Z按下E将注册一个按键E，但同时也会注册一个按键C，即使没有人按下C。所有这一切都与电子键盘的制造方式有关，而您在软件中无能为力。有些键盘没有此限制，但您不能指望您的用户拥有它们。