容器块隐藏时如何设置ace-editor内容？

Question

当容器块被隐藏时，我正在尝试设置ace编辑器内容。

我不能做同样的事。

这是我正在尝试的http://jsfiddle.net/U5JtP/408/

下面是我的代码：

var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/javascript");

$('#hide').click(function(){
    $('.panel-body').hide();
    $('#hide').hide();
    $('#Show').hide();
    $('#setValue').show();
});

$('#Show').click(function(){
    $('.panel-body').show();
    $('#setValue').hide();
    $('#Show').hide();
    $('#hide').show();
});

$('#setValue').click(function(){
    editor.getSession().setValue('function foo(items) {}');
    $('.panel-body').hide();
    $('#setValue').hide();
    $('#Show').show();
    $('#hide').hide();
});

////// -------------------------- Click on Hide -> SetValue -> Show
/// Why ace editor did not updated the content and how to update in such scenario?

你能让它工作吗？

Answer 1

正在设置该值，但未更新编辑器。因此，您必须使用updateFull() which is a method of ace editor's VirtualRenderer手动调用它。

这就是调用该方法的方式

editor.renderer.updateFull();

将setValue方法更新为如下所示

$('#setValue').click(function(){
    editor.getSession().setValue('function foo(items) {}');
    editor.renderer.updateFull();
    $('.panel-body').hide();
    $('#setValue').hide();
    $('#Show').show();
    $('#hide').hide();
});

这是更新的演示http://jsfiddle.net/dhirajbodicherla/U5JtP/410/ ;

PS:如果在#setValue点击处理程序中使用了updateFull，我注意到在更新编辑器时会有一些小延迟。如果在#show点击处理程序中使用updateFull，则不会出现延迟。

Answer 2

我解决了这个问题。在显示编辑器块之后，只需设置一个新值和updateFull()即可。然后它就会正常工作。我有同样的问题，但我尝试了这种方式。它现在起作用了

​

$('#setValue').click(function(){
    $('.panel-body').hide();
    $('#setValue').hide();
    $('#Show').show();
    $('#hide').hide();
    editor.getSession().setValue('function foo(items) {}');
    editor.renderer.updateFull();
});

​