Ace Editor 能否在一页中支持多个代码编辑器? [英] Can Ace Editor support multiple code editors in one page?

问题描述

我希望实现一个 Web 应用程序，该应用程序具有编码竞赛"风格的界面，在单个屏幕中具有 2 个不同的代码编辑器.一个是只读的，另一个是活动的，允许用户进行编辑.

I'm looking to implement a web app that features "coding-competition"-styled interface with 2 different code editors in a single screen. One will be read only and the other will be active and would allow the user to edit.

我目前正在使用 Ace 编辑器，我发现它很棒且易于使用.

I'm currently using Ace Editor and i find it awesome and simple to use.

但是，这是我的问题.在一个页面中尝试实现 2 个不同的编辑器时，我似乎遇到了错误.

未捕获的范围错误:超出最大调用堆栈大小

Uncaught RangeError: Maximum call stack size exceeded

js 脚本中的变量editor"是限制词还是用什么变量名都没有关系?

Is the variable "editor" in the js script a restricted word or it doesn't matter what variable name is used?

这是我的 JS 文件中的代码:

Here's my code in my JS file:

var editorFirst = ace.edit("editorFirst");
var editorSecond= ace.edit("editorSecond");
setupEditor();

function setupEditor() {
    editorFirst.setTheme("ace/theme/eclipse");
    editorFirst.getSession().setMode("ace/mode/javascript");
    editorFirst.setShowPrintMargin(false);
    editorFirst.setHighlightActiveLine(true);
    editorFirst.resize();
    editorFirst.setBehavioursEnabled(true);
    editorFirst.getSession().setUseWrapMode(true);
    document.getElementById('editorFirst').style.fontSize = '14px';

    editorSecond.setTheme("ace/theme/eclipse");
    editorSecond.getSession().setMode("ace/mode/javascript");
    editorSecond.setShowPrintMargin(false);
    editorSecond.setHighlightActiveLine(true);
    editorSecond.resize();
    editorSecond.setBehavioursEnabled(true);
    editorReducer.getSession().setUseWrapMode(true);
    document.getElementById('editorSecond').style.fontSize = '14px';
}

这是我的 html 文件代码:

Here's my code for the html file:

<script src="../assets/js/main.js"></script>
<script src="../assets/js/src/ace.js" type="text/javascript" charset="utf-8"></script>
<div id="editorFirst"></div>
<div id="editorSecond"></div>

预先感谢您的回复！

推荐答案

Ace 可以支持任意数量的编辑器.问题是最近的 回归 破坏了 height=0 的编辑器的 resize 见这个演示

Ace can support any number of editors. The problem is recent regression which breaks resize for editors with height=0 see this demo

这篇关于Ace Editor 能否在一页中支持多个代码编辑器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！