wangEditor修改样式

注意：修改样式，要使用到css的>>>进行穿透，直接修改是不起作用的，即使加上!important也不起作用

不能使用scss，因为使用scss的话，识别不出穿透符号>>>

<template>
    <div>
        <div id="rich-text-editer" class="editor" ref="editor" style="text-align:left"></div>
        <button v-on:click="getContent">查看内容</button>
    </div>
</template>

<script>
    import E from 'wangeditor'
    export default {
     
      data () {
     
        return {
     
          editorContent: '',
          // 预设内容
          text: '
去微软tsdfghjry推广计划明年
'
        }
      },
      methods: {
     
          // 显示html内容
        getContent: function () {
     
            alert(this.editorContent)
        }
      },
      mounted() {
     
          // 绑定
        const editor = new E(this.$refs.editor)
        // 改变时候获取html
        editor.customConfig.onchange = (html) => {
     
            // 获取html文本进行输出
          this.editorContent = html
        }
        editor.customConfig.uploadImgShowBase64 = true 
        editor.customConfig.showLinkImg = false
        editor.create()
        // 预设内容
        editor.txt.html(this.text)
        
      }
    }
</script>

<style  scoped> 
/* 注意不能用scss，使用scss不能识别到>>>,因而会不起作用 */
.editor >>> .w-e-text img{
     
  height: 30px ;
}
.editor >>> .w-e-text h1{
     
    color: yellow;
}    
</style>