Question

我的问题很简单，我想我知道答案，但是如果我错了，那就太好了...
我想使用外部条形码扫描仪（就像物理蓝牙键盘一样工作）来读取条形码，但不能输入任何内容。
我编写了一段代码，该代码在android设备上可以很好地运行，但在iOS设备上什么也没有发生……
我很快讲完，我在“窗口”上监听“键”事件，当我按下“ Enter”键时，我发出条形码事件……
我使用RxJS和Observable fromEvent，并且一切都可以在Android设备上很好地工作。

Safari WebView是问题吗？
我记得我在网站上已经遇到过同样的问题，Safari不会在不需要键盘的元素（输入，文本区域……）之外触发键盘事件

/**
 * Outil pour traiter la lecture d'un codebarre par un lecteur physique
 * Seuls les évènements claviers hors input sont récupérés
 */
export namespace LecteurCodebarrePhysique {
    // L'évènement est-il dans un input ?
    const inInput = (event) => {return event.target instanceof Element && event.target.nodeName.toLowerCase() === 'input'};
    // La touche relachée est-elle un caractère ?
    const isTextKey = (event) => {return !inInput(event) && event.key.length === 1};
    // La touche relachée est-elle la touche entrée ?
    const isEnter = (event) => {return !inInput(event) && event.keyCode === 13};

    /**
     * Observable émettant le codebarre lu par un lecteur physique
     */
    export function codebarreLu(): Observable<{text: string, format: string}> {
        // Observable initiale : évèrement clavier
        const keyup: Observable<KeyboardEvent> = fromEvent(window, 'keyup');
        return keyup.pipe(
            // On ne garde que les touches représentant un caractère
            filter(ev => isTextKey(ev)),
            // On ne garde que la valeur du caractère
            map(ev => ev.key),
            // On «bufferise» en attendant la touche entrée
            buffer(keyup.pipe(filter(ev => {
                const enter = isEnter(ev);
                if (enter) {
                    ev.preventDefault();
                    ev.stopPropagation();
                }
                return enter;
            }))),
            // Quand la touche entrée est relachée, on concatène les caractères
            // Et on essaye de déterminer si c'es un EAN13 (13 caractères numériques)
            map(chars => {
                const codebarre = chars.reduce((code, char) => code + char, '');
                const isEan13 = /\d{13}/.test(codebarre);
                return {text: codebarre, format: isEan13 ? 'EAN_13' : 'INCONNU'};
            })
        );
    }
}

在Android设备上，如果我订阅了observable并读取了任何输入之外的条形码，则将调用订阅中的代码。在iOS设备上，什么都没有发生……

Answer 1

尤里卡！
如果其他人对我有同样的问题/需求，请在此处发布答案！是的，我太客气了^^
我已将事件的目标从“窗口”更改为“文档”，并…等待它……有效。

如何使用Ionic 3在iOS上的任何输入之外监听按键事件

1 个答案: