使用百度富文本出现异常bug

Question

使用百度富文本进行数据录入时，当点击html源码按钮后，然后修改内容直接保存出现数据丢失，切换内容后点击保存出现覆盖数据问题

Answer 1

参考链接：https://www.mdaima.com/jingyan/29.html

百度编辑器ueditor，如何在源码模式与富文本模式相互切换

今天在做评论内容编辑的时候用到了百度编辑器ueditor，但是在测试的时候发现一个问题，因为页面我是用AJAX调用数据再给ueditor写入内容，可如果在对不同内容进行编辑时，先打开的界面调用了编辑器的源码模式，编辑器会记住这个状态，再打开另一评论内容进行编辑时默认也是源码模式，但我想这样也还凑合用吧，可是发现源码模式下加载的内容并没有动态更新，只有在源码模式与富文本模式相互切换一次后才能更新为正确的内容。

所以，索性就一次解决这个问题吧，网上百度了一下，发现对百度编辑器ueditor的切换源码模式和编辑模式的说明文档不太详细，官方的API文档也查了一下，只有一个简单的说明：

Source的两个命令execCommand(String cmd)和queryCommandState(String cmd)
//切换源码模式和编辑模式
execCommand(String cmd) //cmd 命令字符串
//javascript代码示例：
editor.execCommand('source');
//表示切换源码编辑模式和富文本编辑模式，如果当前为“源代码模式”则切换到“富文本编辑模式”，反之“富文本编辑模式”切换为“源代码模式”。

//*****************************************************************************************

//查询当前编辑器的状态是源码模式还是可视化模式
queryCommandState(String cmd) //cmd 命令字符串
//javascript代码示例：
editor.queryCommandState('source');
//返回值为int，如果当前是源码编辑模式，返回1，否则返回0

我们理解了两个命令的功能，就可以利用一下了：
if (UE.getEditor('text_id').queryCommandState('source')==1){
UE.getEditor('text_id').execCommand('source');
UE.getEditor('text_id').focus();
}

因为百度编辑器ueditor只提供了在源码模式与富文本模式相互切换的命令，并没有给出两个指定参数，可以直接设置利用。但好在还给出一个判断当前是哪种模式状态的判定方式，利用queryCommandState命令，如果当前是源码编辑模式，返回值为1，否则返回0。

所以我们先判断一下，如果当前是源码模式就切换为富文本模式，再让编辑器获取焦点，这样每次创建编辑器的时候都可以保持在富文本编辑模式下，结构上保持了统一，也获取了焦点保持了数据的同步。