在毕设项目中使用到了CodeMirror，参照网上的实例 CodeMirror 的 editor 是在 mounted 中创建，如下：

<script>
    ......
	export default {
		name:'SQLContent',
		data() {
			return {
        code: ''
			};
		},
    mounted () {
        debugger
        let mime = 'text/x-mariadb'
        let theme = 'mdn-like'//设置主题，不设置的会使用默认主题
        let editor = CodeMirror.fromTextArea(this.$refs.mycode, {
          mode: mime,//选择对应代码编辑器的语言，我这边选的是数据库，根据个人情况自行设置即可
          indentWithTabs: true,
          smartIndent: true,
          lineNumbers: true,
          matchBrackets: true,
          theme: theme,
          autofocus: true,
          extraKeys: {'Ctrl': 'autocomplete'},//自定义快捷键
          hintOptions: {//自定义提示选项
            tables: {
              users: ['name', 'score', 'birthDate'],
              countries: ['name', 'population', 'size']
            }
          }
        })
        editor.on('change', function(){
          this.code = editor.getValue()
        })
      }
	}
</script>

在给 editor 添加 change 事件时出现错误 cannot read property 'code' of null;

vue 渲染 template 的时间在 beforeMount 之后，mounted 之前，所以渲染 template 时 data 值为null，故而报错；

于是我定义一个全局变量 sqlCode，在 mounted 中对这个全局变量赋值即可解决上述问题。

但是我觉得这不是最好的解决办法，或者说本就不该在 mounted 里赋值，希望得到大家的意见。