最近因为工作需要,用到了富文本编辑器让用户填写反馈,上传图片等功能,经过一些对比选择了tinymce,记录下图片相关问题。
完整版封装的组件代码,放到最后。
环境
- vue2.x
- tinymce 5.10.3
- tinymce-vue 2.1.0
这里由于开发环境是vue2,所以目前这个时间点,需要选择版本的去安装,引用官方文档的一句话
Version 4 of the
tinymce-vuepackage supports Vue.js 3.x, but does not support Vue.js 2.x. For Vue.js 2.x applications, usetinymce-vueversion 3.
图片上传
这个比较简单,在_init的配置中,配置images_upload_handler_
...
data () {init: {images_upload_handler:this.handleImageUpload}
},
methods: {handleImageUpload (blobInfo, success, failure) {// 将图片上传到服务器.let formdata = new FormData()formdata.append('file', blobInfo.blob(), blobInfo.filename())this.uploadImage(formdata).then(success).catch(failure)},uploadImage (formdata) {return new Promise((resolve, reject) => {Axios({url: 'https:

最低0.47元/天 解锁文章
2068

被折叠的 条评论
为什么被折叠?



