在业务开发的时候,曾经使用过wangEditor、Quill、CKEditor,但是后面提出的新需求(需要可以复制微信公众号文章的样式,可以从excel中复制表格),之前使用的编辑器都不能满足,发现Ueditor都满足这个需求,所以把Ueditor研究了一遍,并进行二次开发,在此记录一下。
以下是修改步骤(修改一小部分源代码):
打开ueditor.all.js文件,大概是8082行:
修改后:
虽然后台配置项已经配置成功了,不报错了,但是现在的上传功能还是不能使用的,因为后端还需要写图片/文件上传接口,这个还是不能省略的哈,所以还得往下看:
官网后端接口规范说明:http://fex.baidu.com/ueditor/#dev-request_specification
简单归纳就是上传图片/文件接口返回的格式为:
image.js
大约在第365行,这部分是使用了FEX百度前端团队开发的一个文件上传组件webUploader,以下是我们需要研究及修改的部分:
说明及修改
1、配置里的 fileVal 属性是提交的图片的name属性值,
相当于
这个属性也是后端接口在接收这个文件时的字段名
这里取的是ueditor.config.js中的配置,如果需要修改可以去ueditor.config.js中修改。
2、除了传输文件,如果还想传一些其他的数据,那就需要再配置formData这个选项:
attachment_user.html
attachment.js
第2步,注册UI组件(对话框及按钮):
特别说明:
定义一个全局变量window.ueAttachmentDialog来存放dialog,
这是为了在iframe的操作中可以通过:window.parent.ueAttachmentDialog.close(false)来操作和访问父窗口的方法和变量。