ACE 编辑器宽度更改会丢失内容



我需要能够在用户将代码放入其中更改ace编辑器的宽度。但是,当我更改保持编辑器的div 的宽度时,文本不会将自身包裹到更薄的宽度中,您再也看不到它了(见 https://jsfiddle.net/0d4whvsq/1/(

var editor = ace.edit("ace_editor_div");
editor.getSession().setUseWorker(false);
editor.setOptions({
maxLines: 50,
minLines: 30,
tabSize:2,
wrap:true,
});
//editor.$blockScrolling = Infinity;
editor.setValue("this is meant to be too much text for the width of the editor once the width is made smaller.")
$("#shrink_button").on("click",function(){
$("#ace_editor_div").css("width","200px");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.11/ace.min.js"></script>
<script
src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
crossorigin="anonymous"></script>
<button id="shrink_button">
shrink</button>
</button>
<div id="ace_editor_div"></div>

从上面的例子中可以看出,我在缩小编辑器时丢失了很多文本!我看不到任何与宽度相关的基本设置来解决此问题,我是否缺少一种在调整大小后将所有文本保留在编辑器中的简单方法?我目前正在考虑我可以在调整大小后重新创建整个编辑器,但这显然并不理想。

更改宽度后,需要调用editor.resize()

相关内容

  • 没有找到相关文章

最新更新