Ueditor自定义三方弹窗展示

业务场景：在基于Ueditor的功能基础上，需要二次开发。本文就是记录如何二次开发Ueditor这个富文本编辑器的。
首先本文不适合vue3.0以上，因为对应的Ueditor在系统中引入方式不同，仅介绍2.0及以下项目基于现有的按钮进行二次开发的Ueditor
1.定义按钮

在项目目录中找到此文件，搜索文件中的btnCmds

把要添加的自定义的按钮名称写入。此处我的按钮名称为：tencentmap

2.给按钮添加事件
在当前js文件中：

 // 地图按钮
  UE.registerUI('tencentmap', function(editor, uiName) {
    //注册按钮执行时的command命令，使用命令默认就会带有回退操作
    editor.registerCommand(uiName, {
        execCommand: function() {
          console.log('这是execCommand')
            alert('execCommand:' + uiName)
        }
    });
    //创建一个button
    var btn = new UE.ui.Button({
        //按钮的名字
        name: '腾讯地图',
        //添加额外样式，指定icon图标，这里默认使用一个重复的icon
        cssRules: 'background-position: -500px 0;',
        //点击时执行的命令
        onclick: function() {
        console.log('点击了这个地图')
            //这里可以不用执行命令,做你自己的操作也可
            editor.execCommand(uiName);
        }
    });
    //当点到编辑内容上时，按钮要做的状态反射
    editor.addListener('selectionchange', function() {
        var state = editor.queryCommandState(uiName);
        if (state == -1) {
            btn.setDisabled(true);
            btn.setChecked(false);
        } else {
            btn.setDisabled(false);
            btn.setChecked(state);
        }
    });
    //因为你是添加button,所以需要返回这个button
    return btn;
});