浏览图片（带回调）

使用说明

import { MImageBrowser } from "@yl/super-jssdk";
MImageBrowser.openWithCallback(optional);

参数说明

参数 类型 必填 作用
optional Object 是 必选参数

optional

参数 类型 必填 作用
imgUrls Array 是 图片地址列表，支持本地路径和服务器路径
index Int 是 选中的图片
onDownloadImage(info) Function 否 下载成功回调,如果图片地址是服务器地址，插件下载完每一张图片后会自动回调给前端。info 为 JSON 对象，格式为{"url":"http://www.baidu.com/xxx.png","path":"/xxx/yyy/zzz.png"}
onOpen Function 否 插件打开回调
onSave Function 否 图片或视频保存到系统相册成功回调
onExchange(result) Function 否 查看大图时，更换照片回调,请参照下方 result 说明
options Object 否 可选参数

options 说明

参数 类型 作用
customCachePath string 自定义图片存储路径，仅对需要下载的图片有效，可选值.(Android 推荐传空，使用默认设置)
text string 添加到图片上的文本，文本长度不宜超出屏幕宽度。为兼容小屏手机，建议 20 个汉字以内(数字字母两个算一个汉字)
textBackground string 文字整行的背景颜色，格式为 16 进制，推荐值(即默认值)：#40000000
textColor string 文字颜色，格式为 16 进制，推荐值(即默认值)：#FFFFFF
horizontalOrientation int 文本框水平布局方向.可传值：1 左, 2 水平居中, 3 右， 默认 3 右. 仅 text 不为空有效
verticalOrientation int 文本框垂直布局方向.可传值：1 上, 2 垂直居中, 3 下， 默认 3 下. 仅 text 不为空有效
isSave BOOl 是否显示保存图片界面
toolBar jsonobject 底部 toolbar 选项

toolBar

参数 类型 作用
isShow bool 底部 toolbar 是否显示. 默认 false
isShowChange bool 底部更换照片按钮是否显示. 默认 true
changeOption array 显示更换照片模式选项,1:拍照 2:相册. 默认[1,2] 1.1.8+ 版本可用

result 说明 1.1.8+ 版本可用

参数 类型 作用
imagePath string 原图地址
exchangePath string 更换后的新图地址
changeMode int 更换的模式 1: 拍照 2: 相册

返回说明

参数 类型 作用
resolve Function 打开成功回调
reject Function 打开失败回调

代码示例

MImageBrowser
.openWithCallback({
  imgUrls: [
    "https://scp-minio-test.myyscm.com/test-cgsaas/324d0bdd-ded1-4463-88a0-8d855a1ac2f4/5b3bb4775cc6363bf14096926c5fdb2b.png",
    "https://scp-minio-test.myyscm.com/test-cgsaas/74e12b71-dead-417b-a29a-99d3ce3eee73/3ea9e077c17ebc199a8137f29f1e0222.jpg",
  ],
  index: 5,
  options: {
    isSave: true,
  },
  onDownloadImage: (res) => {
    console.log("onDownloadImage", res);
  },
  onOpen: () => {
    console.log("onOpen");
  },
  onSave: () => {
    console.log("onSave");
  },
  onExchange: (res) => {
    console.log("onExchange", res);
  },
})
.then((res) => {
  // 代替 onClose 方法
  console.log("res", res);
})
.catch((err) => {
   // 代替 onError 方法
  console.log("err", err);
});

results matching ""

    No results matching ""