放置请求后 ACE 编辑器呈现错误

Question

在 'put' 请求更新对象字段（使用 django rest framework, which makes use of Ajax Form 用于 PUT/PATCH/DELETE/OPTIONS 方法）后，我遇到了 ACE 编辑器问题。

我目前在表单中隐藏一个文本区域并替换为 ace 编辑器，在更改时使用编辑器的内容更新文本区域。

但是，在 put 上 - 发生以下情况

变成

我不确定发生了什么。可能是 ace/css/ace_editor.css 没有加载，但我不确定为什么会发生这种情况......

如有任何帮助，我们将不胜感激！

     $(function () {
              $('textarea[name=SQL]').each(function () {             
                  console.log('new editor');  
                  $('form').find('textarea[name=SQL]').attr('id','textarea-code');
                  $('#textarea-code').parent().append('<div id="ace-editor" class="ace-editor-class" style="height: auto;min-height:100px"></div>');  
                  var editor = ace.edit("ace-editor"); 
                  editor.setTheme("ace/theme/crimson_editor"); 
                  editor.getSession().setMode("ace/mode/sql");  
                  var textarea = $('#textarea-code').css('display', 'none'); 
                  editor.getSession().setValue(textarea.val());  
                  editor.getSession().on('change', function(){
                    textarea.val(editor.getSession().getValue()); 
                    editor.resize(true); 
                  });
              });
            });

Answer 1

临时解决方案： 编辑器似乎缺少一些重要的 css (.ace_editor)。解决方案是复制 ace.js 的第 14388 行：

var editorCss = ".ace_editor {\ ...

进入本地 css 文件（先删除所有 \）。

放置请求后 ACE 编辑器呈现错误

ACE editor rendering error after a put request

javascript

ace-editor