如何实现代码镜像以在没有 CTRL+SPACE 的情况下显示提示答案

【问题标题】：How to implement code mirror to show hint without CTRL+SPACE如何实现代码镜像以在没有 CTRL+SPACE 的情况下显示提示
【发布时间】：2018-05-17 06:18:09
【问题描述】：

JavaScript：

        $http.get("/getApexBody", config).then(function(response) {
            document.getElementById("saveBtn").disabled = false;
            document.getElementById("cleanBtn").disabled = false;
            $scope.apexClassWrapper = response.data;
            $('#loaderImage').hide();
            if (globalEditor1) {
                globalEditor1.toTextArea();
            }
            setTimeout(function(test) {
                CodeMirror.commands.autocomplete = function(cm) {
                    cm.showHint({
                        hint: CodeMirror.hint.auto
                    });
                };
                var editor = CodeMirror.fromTextArea(document.getElementById('apexBody'), {
                    lineNumbers: true,
                    matchBrackets: true,
                    extraKeys: {
                        "Ctrl-Space": "autocomplete"
                    },
                    gutters: ["CodeMirror-lint-markers"],
                    lint: true,
                    mode: "text/x-apex"
                });
                globalEditor1 = $('.CodeMirror')[0].CodeMirror;
            }), 2000
        });

这是我的 JS 文件，ctrl-space 可以正常工作，但我需要在没有任何键绑定的情况下实现自动完成。

我什至试过这个：

        $http.get("/getApexBody", config).then(function(response) {
            document.getElementById("saveBtn").disabled = false;
            document.getElementById("cleanBtn").disabled = false;
            $scope.apexClassWrapper = response.data;
            $('#loaderImage').hide();
            if (globalEditor1) {
                globalEditor1.toTextArea();
            }
            setTimeout(function(test) {
                /* CodeMirror.commands.autocomplete = function(cm) {
                    cm.showHint({
                        hint: CodeMirror.hint.auto
                    });
                };*/
                var editor = CodeMirror.fromTextArea(document.getElementById('apexBody'), {
                    lineNumbers: true,
                    matchBrackets: true,
                    /*extraKeys: {
                        "Ctrl-Space": "autocomplete"
                    },*/
                    gutters: ["CodeMirror-lint-markers"],
                    lint: true,
                    mode: "text/x-apex"
                });
                editor.on('inputRead', function onChange(editor, input) {
                    if (input.text[0] === ';' || input.text[0] === ' ') {
                        return;
                    }
                    CodeMirror.commands.autocomplete = function(editor) {
                        editor.showHint({
                            hint: CodeMirror.hint.auto
                        });
                    };
                });
                globalEditor1 = $('.CodeMirror')[0].CodeMirror;
            }), 2000
        });

但这不起作用。我在这里缺少什么吗？如何使用 codemirror 显示实时完成提示？

我使用了 show-hints.js ，并对其进行了一些修改以适用于“。”也。请帮忙。

【问题讨论】：

标签： javascript autocomplete codemirror

【解决方案1】：

使用此功能自动完成codeMirror，无需CTRL + Space。

在show-hint.js 中将completeSingle 设置为false

editor.on("inputRead", function(instance) {
    if (instance.state.completionActive) {
            return;
    }
    var cur = instance.getCursor();
    var token = instance.getTokenAt(cur);
    if (token.type && token.type != "comment") {
            CodeMirror.commands.autocomplete(instance);
    }
});

【讨论】：

【解决方案2】：

    $http.get("/getApexBody", config).then(function(response) {
            document.getElementById("saveBtn").disabled = false;
            document.getElementById("cleanBtn").disabled = false;
            $scope.apexClassWrapper = response.data;
            $('#loaderImage').hide();
            if (globalEditor1) {
                globalEditor1.toTextArea();
            }
            setTimeout(function(test) {
                /*CodeMirror.commands.autocomplete = function(cm) {
                    cm.showHint({
                        hint: CodeMirror.hint.auto
                    });
                };*/
                var editor = CodeMirror.fromTextArea(document.getElementById('apexBody'), {
                    lineNumbers: true,
                    matchBrackets: true,
                    styleActiveLine: true,
                    extraKeys: {
                        ".": function(editor) {
                            setTimeout(function() {
                                editor.execCommand("autocomplete");
                            }, 100);
                            throw CodeMirror.Pass; // tell CodeMirror we didn't handle the key
                        }
                    },
                    gutters: ["CodeMirror-lint-markers"],
                    lint: true,
                    mode: "text/x-apex"
                });
                editor.on('inputRead', function onChange(editor, input) {
                    if (input.text[0] === ';' || input.text[0] === ' ') {
                        return;
                    }
                    //CodeMirror.commands.autocomplete = function(editor) {
                    editor.showHint({
                        hint: CodeMirror.hint.auto
                    });
                    //};
                });
                globalEditor1 = $('.CodeMirror')[0].CodeMirror;
            }), 2000
        });

这可行，但在输入“.”后，它确实给出了该特定变量的方法，但在输入更多匹配的单词后，它再次开始显示原始单词集的提示。

例如：isBatch 和 isAbort 是 System 类的两个方法。

当我开始输入 Sy... 系统出现时，然后我输入“.”，这两个方法显示 isBatch 和 isAbort，但是当我输入 isA 而不是显示 isAbort 时再次开始显示完整单词列表中的提示。

有没有办法避免这种情况？

【讨论】：