项目需要在线展示和编辑Json文件，所以需要找一个代码编辑器，因为我们的项目直接使用的 vueAdmin-template 这个模板
json编辑器也是直接从 vue-element-admin 项目扒下来的……
//好吧 这个项目看起来很炫，其实有很多坑，我们组没人用过vue，又需要快速完成任务，就随便找了一个= =
JsonEditor.vue（和原项目比我改了一下
使用：
其中 jsonData 是json的字符串
开始的时候还在感叹好强大 但是随后，问题出现了……
第一个问题，一个页面有多个tab页，而json显示不在第一个tab页中，那么跳转到页面再点击json所在tab页……
嗯……默认显示不出来……
奇怪的事情是，当你点击一下，数据就出来了……更奇怪的事情是……甚至你拖一下开发者工具那个框，它也有可能就显示出来了，或者，你首先打开的tab也就是它，嗯，那也能显示出来……
对于这个问题，我选择了放弃，毕竟这可以解释为默认折叠的feature >_<
but，测试不听我解释并给我提出了个bug，还指出了一个更加丧病的bug……
如图，我把代码点开了，它竟然显示时这个shi样……（诡异的事情是，当行数变成10行以后它就显示正常了……
绝望……
更加绝望的事情是我百度了一年也没搜出来一点点相关信息……
无奈之下跑去找大神帮助。
总之最后解决的办法就是……
methods: { // ... refresh() { this.jsonEditor.refresh() } }
为 jsonEditor 加一个 refresh() 函数
并在每一次切换tab页的时候，都调用该组件的 refresh()
注意……不是直接调用……而是放入setTimeout中……
window.setTimeout(() => { this.$refs.jsonEditor1.refresh() this.$refs.jsonEditor2.refresh() })
我都已经双眼含泪了，不管怎样，问题终于得到解决了。
嗯……最后呢……解决办法……其实是：
autoRefresh: true
具体如下：（亲测autoRefresh有些时候不生效，手动刷新比较稳妥……）
import 'codemirror/addon/display/autorefresh' this.jsonEditor = CodeMirror.fromTextArea(this.$refs.textarea, { lineNumbers: true, mode: 'application/json', gutters: ['CodeMirror-lint-markers'], theme: 'rubyblue', lint: true, autoRefresh: true })
好了，现在没问题了，不用手动refresh了……
心好累啊，这个故事教给我们一个道理，技术问题尽量用谷歌，用谷歌，用谷歌。。。。实在不能***，就去github讨论区去搜一搜。百度还是算了吧。。。。
至于 autoRefresh 怎么实现的： https://codemirror.net/addon/display/autorefresh.js
自行参考吧。