codemirror编辑器必须点击一下输入区域，代码才能正常显示的问题

问题情景：

编辑器是放在 element-ui 的对话框里的（el-dialog），第一次点开对话框的时候，编辑器可以正常显示代码。但关闭对话框并再次打开之后，编辑器没有显示代码，并且编辑器右边多了一个类似滚动条的东西，此时再点击编辑器区域，才会显示代码。

网上主流的解决办法：

网上大部分都使用了 refresh() 这个函数，但是我用了没有效果，具体用法参见这篇文章。其它地方的贴子可能代码略有不同，但核心都是用 refresh() 。

我的解决办法：

后来在另外的贴子那里看到了这句话：

“原因据说是多个codemirror相互影响导致，但是我只有一个codemirror 的时候也出现这个问题”

于是想到了：可能是因为我这里第一次关闭对话框的时候，codemirror 没有重置，既然 refresh() 没有效果，那不如就直接给对话框设置一个 v-if ，当关闭对话框的时候，v-if 设置为 false，此时对话框这个元素节点就会被清除，当点击显示对话框的时候，v-if 再设置为 true，这样也就变相达到了重置 codemirror 的效果。
具体代码我就不贴了，因为每个人遇到的场景不同，我这里只是把解决思路分享出来。

核心思路就一句话：通过元素节点的删除和重新渲染，达到重置单个 codemirror 的目的。

————————————————————————————————————————————

2023/03/07 更新：
用工作电脑的时候，从别的贴子那里看到的，过后几天才想起来要更新我自己的贴子，原贴也就没保存，惭愧。
想要使 refresh 起作用，需要将其放入 nextTick 中调用，本人亲测有效。将其放入 setTimeout 中调用好像也有效果，这个没测试过。