javascript - 在Codemirror中看不见的部分文字

我使用Codemirror并对此进行了设置（使用最新版本的Google Chrome）：

<script>
  var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
    mode: 'markdown',
    autoRefresh:true,
    lineNumbers: false,
    lineWrapping: true,
    theme: "default",
    extraKeys: {"Enter": "newlineAndIndentContinueMarkdownList"},
  });
</script>

问题是在滚动或编辑文本之前，文本的一部分不可见。

1. editor.refresh（）失败

因为我的包含textarea的div从一开始就不可见，所以我将其称为editor.refresh();。在看不到任何文字之前。

2. setTimeout失败

我也没有运气就尝试了这个技巧：

setTimeout(function() {
    editor.refresh();
},1);

3. autoRefresh失败

我也尝试了autoRefresh插件，但是没有任何区别。

下面是一个动画屏幕截图，您可以在其中查看发生了什么。

一些更多的信息

具有pre类的CodeMirror-line不会呈现。它不仅隐藏，甚至不存在。我想Codemirror会尝试变得聪明并按需渲染？

最佳答案

编辑：在这里https://discuss.codemirror.net/t/part-of-text-not-rendered/2030/5对该问题的答复是有效的解决方案是指定选项viewportMargin: Infinity。

我遇到了这样的问题，它最终是由我自己在CodeMirror之外的CSS布局不正确引起的。尝试检查CodeMirror元素，然后检查其高度。高度应在显示屏内，而不是显示屏外。当我遇到类似的问题时，CodeMirror实例的高度大于显示的高度。我通过确保最终包含CodeMirror实例的所有div的高度为100％来更正此错误。

关于javascript - 在Codemirror中看不见的部分文字，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/55372532/