CodeMirror 2 - 隐藏的文本区域显示后编辑器高度错误

Question

我有一个被 DIV 容器包围的文本区域：

<div>
  <textarea id="code"> some text here </textarea>
</div>

这个文本区域使用 CodeMirror 转换为代码编辑器：

CodeMirror.fromTextArea('code', {
  lineNumbers: true,
  matchBrackets: true,
  mode: 'text/html'
});

问题在于当textarea的容器被隐藏时（有时会隐藏，这取决于用户选择显示什么），然后切换到取消隐藏后，CodeMirror编辑器不会像应该出现。它只显示一行，你必须实际点击其中才能重新绘制并正确显示。

有人知道如何解决吗？

- Alex

Answer 1

refresh()
如果您的代码执行了一些操作，以更改编辑器元素的大小（窗口调整大小已被监听），或者显示它，则应该调用此方法来确保CodeMirror看起来符合预期。

来自CodeMirror手册 （假设您正在使用版本2）

- gblazex

---

谢谢，我没有想到需要刷新，因为我隐藏和显示了HTML上面的其他容器，而CodeMirror似乎可以为它们工作。 - Alex

实际上，那并不起作用。我尝试了多种类型的refresh()，但都没有效果。我正在使用Bootstrap来构建我的UI。我在一个弹出式的模态“对话框”中使用CodeMirror文本区域。当这个对话框弹出时，文本区域被隐藏了，只显示了一行。在单击该区域后，它才会重新绘制。 - Mike Eggleston