vue标签页tabs和codemirror一起使用

vue标签页tabs和codemirror一起使用时， codemirror 会变形

 

要注意tab切换时，codemirror必须刷新配置

<el-tabs v-model="configupload.upload_active" type="card" @tab-click="handleChangeImport">
    <el-tab-pane label="上传导入" name="upload">
        <el-upload
                class="upload-k8sconfig"
                ref="upload"
                action="string"
                :before-upload="beforeConfigUpload"
                :http-request="UploadConfig"
        >
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">导入/etc/kubernetes/admin.conf文件</div>
        </el-upload>
    </el-tab-pane>
    <el-tab-pane label="输入导入" name="input">
        <codemirror ref="import_codemirror" v-model="configupload.config" :options="cmOptions"
                    class="sourcecode"/>
    </el-tab-pane>
</el-tabs>

......

<script>
...
      handleChangeImport(tab){
        if (tab.name === 'input') {
          this.$nextTick(() => {
            this.$refs.import_codemirror.codemirror.refresh();
          })
        }
      },
...
</script>