Ueditor二次渲染问题

<div>
   <label style="flex: 0 0 120px;"><i>*</i>富文本：</label>
   <script id="editor" type="text/plain" style="width:100%;height:500px;">       
   </script>
</div> 
 
<script type="text/javascript">
         //实例化编辑器       
         var editor= UE.getEditor('editor'});
</script>

修改信息时，在渲染富文本Ueditor，会出现第一次打开信息回显不成功，关闭后再打开信息回显就成功的情况。原因是Ueditor在渲染的时候需要时间，而执行UE.getEditor('editor').setContent('data')时有可能富文本框还没渲染好，就执行了赋值语句，所以文字回显失败，关闭后再次打开，富文本框已渲染成功，则setContent执行成功，所以文字回显成功。

解决方案，延迟执行setContent

1、使用setTimeout函数，例如：1s后执行setContent

setTimeout(function () { UE.getEditor('editor').setContent(data); }, 1000);

问题解决，但这种解决方案，富文本渲染快的时候，1s回显就会感觉到有延迟，就跟系统卡顿一样。富文本渲染慢的时候，1s又不够（大多数已经满足了，够慢了），还是回显失败。时间不好把控。

2、使用监听ready事件。

UE.getEditor('editor').addListener("ready", function () {
   UE.getEditor('editor').setContent(data);
});

问题完美解决，没有延迟。但ready事件只执行一次，就是在富文本框渲染成功之后，当你保存或取消时候窗口关闭再次打开时，ready事件不再执行，会导致你再次打开窗口二次编辑的时候回显不成功，这是因为二次打开富文本时用的还是上一个富文本实例，已经渲染成功，不再执行ready事件。所以，要想每次都使用监听必须每次新建富文本框，也就是在取消和保存成功的方法里将富文本销毁

if(typeof(UE.getEditor("editor")) !='undefined'){
		UE.getEditor("editor").destroy();
}

每次点击编辑按钮的时候执行

//重新获取渲染
var editor = UE.getEditor('editor');
//editor渲染成功后执行setContent
editor.addListener("ready", function () {
	editor.setContent(data);
});

这样就完美解决了。

延伸：

在使用富文本时候，按钮比较多。一种是列举出自己想要的按钮，一种是屏蔽不想要的按钮。这里要说的是屏蔽按钮。屏蔽的时候是根据id去除的，editor的id和按钮id定位

#editor #edui3, #editor #edui4, #editor #edui5{display:none!important;}

在使用第二种ready监听的时候，每次创建新的富文本，会导致按钮id不停的变更，则第二次打开就会，写的屏蔽按钮就会失效，因为id变了。所以，就看取舍去选择使用吧。

综上：editor渲染的时候，如果已经有了，就使用，如果没了就创建，就跟java中new对象一样，每次new的都是一个新的对象。