Question

我正在使用codemirror编辑器...我希望像列表中的项目样式一样，当我做自动完成时，我会使用代码镜像提供给我的任何lib或插件比codemirror更多的功能。 .. 注意：我想将它与codemirror一起使用，而不是使用codemirror。 ...提前谢谢

Answer 1

是的，您可以使用hint addon进行自动填充。您可以通过修改addon/hint/show-hint.css来设置项目的样式。

Answer 2

我成功了。在show-hint.css中我添加了一些CSS：

.table.CodeMirror-hint {
  font-weight: bold;
  color: black;
}

.column.CodeMirror-hint {
  font-weight: bold;
  color: black;
}

.keyword.CodeMirror-hint {
  font-weight: bold;
  color: #BF00FF;
}

.builtin.CodeMirror-hint {
  font-weight: bold;
  color: #2E64FE;
}

在我的主网页中，我动态地将所有表/列作为对象添加到hintOptions。对于每张桌子，我都喜欢这样：

        var tcobjs = []; //table columns array of object
        for (j=0; j < tablecolumns.length; j++) {
            tcobjs.push({text:tablecolumns[j],className:"column"});
        }
        hintOptions.tables[table]=tcobjs;

我修改了这样的addon / hint / sql-hint.js：

  var keywords;
  var builtin;

  function getKeywords(editor) {
    var mode = editor.doc.modeOption;
    if (mode === "sql") mode = "text/x-sql";
    var words = {};
    for (var w in CodeMirror.resolveMode(mode).keywords) { words[w] = CodeMirror.resolveMode(mode).keywords[w]; }
    return words;
  }

  function getBuiltin(editor) {
    var mode = editor.doc.modeOption;
    if (mode === "sql") mode = "text/x-sql";
    var words = {};
    for (var w in CodeMirror.resolveMode(mode).builtin) { words[w] = CodeMirror.resolveMode(mode).builtin[w]; }
    return words;
  }

[....]

    keywords = getKeywords(editor);
    builtin = getBuiltin(editor);

[....]

      addMatches(result, search, tables, function(w) {return {text:w,className:"table"};});
      addMatches(result, search, defaultTable, function(w) {return {text:w,className:"table"};});
      if (!disableKeywords)
        addMatches(result, search, keywords, function(w) {return {text:w.toUpperCase(),className:"keyword"};});
      addMatches(result, search, builtin, function(w) {return {text:w.toUpperCase(),className:"builtin"};});

我可以使用任何lib与codemirror进行自动完成吗？

2 个答案: