tinymce富文本实现可编辑和不可编辑状态

tinymce插件实现可编辑和不可编辑状态

啊哈哈，别想了！！！看看孩子的简单方法吧
首先，看官方文档，没找到ba
其次百度搜一搜，这个，那个看一堆，完全没必要兄弟姐妹们！
动动脑子！！！
遮罩层啊，有什么事情是遮罩层搞不定的？！
小声逼逼：你要想到啊！有可编辑不可编辑两种情况！
多写个判断就好我?
上代码：

	<template v-else>
       <div v-if="reportStatus==2">
          <tinymce v-model="rxtContent" :key="tinymceFlag" :height="300"></tinymce>
       </div>
       <div class="tinymacClass" v-else>
           <tinymce v-model="rxtContent" :key="tinymceFlag" :height="300"></tinymce>
       </div>
	</template>

css:

.tinymacClass{
        position:relative;
        left:0;
        top:0;
        opacity:.5;
        width:100%;
        height:100%;
        background:#000;
        z-index:998;
        pointer-events: none;
    }

注意：pointer-events：none；是可以点击下面的事件，但是因为我是包着的，所以无效！如果你是用下面这种方法写的，注意注释掉！！

<div class="tinymac">
     <div><tinymce :key="tinymceFlag" v-model="dataForm.noticeDetails" :height="300"></tinymce></div>
     <div class="tinymacClass"></div>
</div>

看懂没！关于key不了解的去看我的另一篇博客超链接
动动脑子，你也可以！今天也是学习的一天 ?