swan.openReplyEditor

基础库 3.100.4 版本开始支持,以下版本请使用小程序发布器组件。

解释: 调起半屏内容发布器,并支持开发者配置发布器展示模块。此api版本为单框架,不接入百度服务,即发布的内容无法进入百度app个人主页、无法接入百度互动消息推送。若想自动接入百度服务,请使用半屏内容发布器带服务版

方法参数

Object object

object参数说明

属性名类型必填默认值说明
sendBackgroundColorString#3388ff发布按钮填充颜色,支持#333 和#333333 两种写法
sendTextColorString#FFFFFF发表按钮颜色,支持#333 和#333333 两种写法
sendTextObject发表发表的显示文案
contentPlaceholderString请输入内容内容提示占位文案
moduleListArray显示模块list
emojiPathString设置自定义表情配置路径
successFunction发布内容的回调函数
failFunction调起失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明

参数名类型说明
statusString当前发布器状态 reply: 点击发表按钮;draft: 草稿状态,发布器当前为隐藏状态。
tempFileArray.<object>图片的本地文件列表,每一项是一个 File 对象。
contentString正文

moduleList 列表

若moduleList传空数组或不传,则默认展示正文、图片模块、表情模块。若传值,则只展示所传 list 中配置的模块。如:moduleList: ['image'] 则只展示图片模块。

moduleList类型描述
imageString图片模块
emojiString表情模块

emojiPath 参数说明

开发者在配置 emoji 模块后,可以选择是否使用自定义表情表。若使用自定义表情功能,则将自定义表情的资源文件夹路径传入 emojiPath 字段。若不传 emojiPath 字段则使用默认表情包。

自定义表情资源文件夹格式

文件夹中包括:emoji.json 和所有表情图片资源。外层文件夹名字可以由开发者自由定义,路径配置在 emojiPath 中即可,emoji.json 为固定文件名,请开发者按格式创建。表情没有数量和大小限制,但是表情资源会占用包体大小。

图片

emoji.json 格式:

图片

示例

扫码体验

swan.openReplyEditor - 图3请使用百度APP扫码

图片示例

swan.openReplyEditor - 图4

swan.openReplyEditor - 图5

swan.openReplyEditor - 图6

代码示例1 moduleList传emoji并配置自定义图标 :

在开发者工具中预览效果

  1. swan.openReplyEditor({
  2. sendBackgroundColor: '#3388ff',
  3. sendTextColor: '#FFFFFF',
  4. sendText: '发送',
  5. contentPlaceholder: '请输入评论内容',
  6. moduleList: ['emoji'],
  7. emojiPath: '../../emojidata',
  8. success: res => {
  9. console.log('openReplyEditor success', res);
  10. // 点击了发表按钮
  11. if (res.status === 'reply') {
  12. // 开发者处理返回内容。
  13. // 主动关闭评论发布器
  14. swan.closeReplyEditor({
  15. success: res => {
  16. console.log('closeReplyEditor success', res);
  17. }
  18. });
  19. }
  20. // 点击发布器外隐藏发布器,编辑的内容将存为草稿
  21. else if (res.status === 'draft') {
  22. // 处理草稿内容,如ui处理
  23. }
  24. },
  25. fail: function (res) {
  26. console.log('openReplyEditor fail', res);
  27. },
  28. complete: function (res) {
  29. console.log('openReplyEditor complete', res);
  30. }
  31. })

代码示例2 moduleList传image :

在开发者工具中预览效果

  1. swan.openReplyEditor({
  2. sendBackgroundColor: '#3388ff',
  3. sendTextColor: '#FFFFFF',
  4. sendText: '发送',
  5. contentPlaceholder: '请输入评论内容',
  6. moduleList: ['image'],
  7. emojiPath: '../../emojidata',
  8. success: res => {
  9. console.log('openReplyEditor success', res);
  10. // 点击了发表按钮
  11. if (res.status === 'reply') {
  12. // 开发者处理返回内容。
  13. // 主动关闭评论发布器
  14. swan.closeReplyEditor({
  15. success: res => {
  16. console.log('closeReplyEditor success', res);
  17. }
  18. });
  19. }
  20. // 点击发布器外隐藏发布器,编辑的内容将存为草稿
  21. else if (res.status === 'draft') {
  22. // 处理草稿内容,如ui处理
  23. }
  24. },
  25. fail: function (res) {
  26. console.log('openReplyEditor fail', res);
  27. },
  28. complete: function (res) {
  29. console.log('openReplyEditor complete', res);
  30. }
  31. })

Bug & Tip

  • 工具返回的 status 是0,与预期不符,正在修复中