先看下官方文档

https://developers./miniprogram/dev/component/editor.html 富文本组件文档

文档上的代码比较少建议在开发工具中预览代码片段，如下图：

// 点击图片将图片插入富文本编辑器里面insertImage() {const that = this;wx.chooseImage({count: 1,sizeType: ['original', 'compressed'],sourceType: ['album', 'camera'],success: function (res) {console.log(res.tempFilePaths,'上传图片')wx.uploadFile({url: '自己的图片上传地址',filePath: res.tempFilePaths[0],name: 'file',formData: {app_token: app.data.userInfo.app_token,},success: function (res) {console.log(res.data,'图片上传之后的数据')var data = JSON.parse(res.data)console.log(data.data.url)that.editorCtx.insertImage({src: data.data.url,success: function () {console.log('insert image success')}})}}) }})}

如果低版本基础库的用户较多建议做下兼容。如果需要编辑富文本之前提交的内容，就需要在富文本初始化的时候加载出上一次提交的数据，拉取数据的代码需要放到。

//初始化富文本编辑器方法onEditorReady() {const that = thiswx.createSelectorQuery().select('#editor').context(function (res) {that.editorCtx = res.contextthat.loadData();//这里拉取需要编辑的数据然后初始化到编辑器里面}).exec()},

拉取数据成功之后调用初始化编辑器内容的api

//初始化富文本编辑器方法that.editorCtx.setContents({html: '这里放接口返回的富文本标签数据',success: function () {console.log('insert html success')}})

此时就能从详情页点击编辑，然后初始化富文本的内容再次进行编辑跟提交的操作了。

项目效果图如下：