在Codemirror中看不见的部分文字

Question

我使用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会尝试变得聪明并按需渲染？

Answer 1

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

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