CodeMirror 编辑器：在特定键模式后显示提示，如 @@

Question

我使用 CodeMirror 作为编辑器，以 show-hint.js 和 anyword-hint.js 为例。默认情况下，提示会在按下 Ctrl-Space.

后出现

问题:

我希望 CodeMirror 在我键入 @@ 和 Ctrl-Space 后显示提示。

我已经尝试过的：

我尝试添加 extraKeys，如 "'@'": "autocomplete" 和 "'@'-'@'": "autocomplete"，但它不起作用。它适用于单个 @，但不适用于 @@.

HTML:（保存为.html）

<!doctype html>
<title>CodeMirror: Any Word Completion Demo</title>
<meta charset="utf-8" />
<link rel=stylesheet href="https://codemirror.net/doc/docs.css">
<link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css">
<link rel="stylesheet" href="https://codemirror.net/addon/hint/show-hint.css">
<script src="https://codemirror.net/lib/codemirror.js"></script>
<script src="https://codemirror.net/addon/hint/show-hint.js"></script>
<script src="https://codemirror.net/addon/hint/anyword-hint.js"></script>
<script src="https://codemirror.net/mode/javascript/javascript.js"></script>
<article>
  <h2>Any Word Completion Demo</h2>
  <form>
    <textarea id="code" name="code">
      function isInt(n) { return n % 1 === 0; }
    </textarea>
  </form>
  <script>
    CodeMirror.commands.autocomplete = function(cm) {
      cm.showHint({
        hint: CodeMirror.hint.anyword
      });
    };
    var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
      lineNumbers: true,
      extraKeys: {
        "Ctrl-Space": "autocomplete",
        "'@'": "autocomplete",
      }
    });
  </script>
</article>

Answer 1

我解决了this.If有更好的建议请post。

var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
  lineNumbers: true,
  extraKeys: {
    "Ctrl-Space": "autocomplete",
    "'@'": function(cm) {
      var charTomatch = '@';
      var curretCursorPosition = cm.getCursor();
      var backwardCursorPosition = {
        line: curretCursorPosition.line,
        ch: curretCursorPosition.ch - 1
      };
      var forwardCursorPosition = {
        line: curretCursorPosition.line,
        ch: curretCursorPosition.ch + 1
      };
      var backwardCharacter = cm.getRange(backwardCursorPosition, curretCursorPosition);
      var forwardCharacter = cm.getRange(curretCursorPosition, forwardCursorPosition);
      //update text anyway
      cm.replaceRange(charTomatch, curretCursorPosition);
      //
      if (backwardCharacter === charTomatch || forwardCharacter === charTomatch) {
        CodeMirror.commands.autocomplete(cm);
      }
    }
  }
});

CodeMirror 编辑器：在特定键模式后显示提示，如 @@

CodeMirror editor: show hint after specific key pattern like @@

javascript

jquery

codemirror