ueeditor的使用_UEditor使用总结

前言

UEditor的bug太多了，为了避免大家浪费时间，把自己这几天在扩展UEditor功能时遇到的问题总结一下，希望能帮到大家 ，我是在vue框架中使用的UEditor插件，可能你在其他前端框架中使用，具体代码可能有一点点不同，但实现逻辑一样。我在做这些功能时主要参考了这几个也基于UEditor扩展的编辑器：135编辑器、96编辑器等

PM提的各种需求如下：

UEditor图片等比缩放

UEditor中的所有图片都是按原图的比例等比缩放

UEditor作者已经在github上提供了具体解决方法：

具体修改在ueditor.all.js 16995行(大致位置大家自己找吧) 或者 在ueditor.all.js搜索 updateTargetElement 这个方法名也行

updateTargetElement: function () {

var me = this;

var newWidth = parseInt(me.resizer.style.width);

// var newHeight = parseInt(me.resizer.style.height);

var oldHeight = parseInt(me.target.naturalHeight);

var oldWidth = parseInt(me.target.naturalWidth);

var c =(oldHeight*newWidth)/oldWidth;

domUtils.setStyles(me.target, {

'width': me.resizer.style.width,

'height': c+'px'

});

// var scale = parseInt(me.target.height)/parseInt(me.target.width);

// me.target.width = parseInt(me.resizer.style.width);

// me.target.height = parseInt(me.target.width)*scale;

// me.target.width = parseInt(me.resizer.style.width);

// me.target.height = parseInt(me.resizer.style.height);

me.attachTo(me.target);

}

UEditor换图操作

要求换的图片替换当前图片，并且大小尺寸一样

这个需求我参考 135编辑器 偷了个懒，直接把图片操作浮层上的修改按钮改成换图。因为UEditor提供的修改图片功能就是替换一下图片，