vue wangeditor回显设置初始样式

Vue Wangeditor是一个基于百度编辑器的富文本编辑器组件，用于Vue.js项目中。若想在初始化时设置Wangeditor的初始样式，你需要在组件的`created()`、`mounted()`钩子函数，或者在模板中通过计算属性来完成。以下是一个简单的例子：

<template>
  <div ref="wangeditor">
    <!-- ... -->
  </div>
</template>

<script>
import WangEditor from 'vue-wangeditor'

export default {
  components: {
    WangEditor,
  },
  data() {
    return {
      editorContent: '', // 这里存储初始内容，可以来自服务器或者其他地方
      initialStyle: { // 定义初始样式的对象
        fontSize: '14px',
        lineHeight: '1.5em',
        fontFamily: '宋体',
        backgroundColor: '#fff', // 样式示例
      }
    }
  },
  mounted() {
    this.$nextTick(() => {
      const editor = this.$refs.wangeditor.create();
      editor.customConfig.onInit = () => {
        editor.editor.body.style.cssText = JSON.stringify(this.initialStyle); // 将样式对象转换成CSS字符串并应用到编辑器上
      };
      editor.customConfig.content = this.editorContent; // 设置初始内容
    });
  }
}
</script>

这里我们首先在数据对象中定义了`initialStyle`变量，并在`mounted`钩子中创建编辑器实例时设置了初始样式。注意要先通过`$nextTick`确保DOM已经渲染完毕再操作。