@youngbeen/qmhn-jsbridge
v0.2.3
Published
The js api interface layer for qmhn app jsbridge powered by dsbridge
Downloads
8
Readme
qmhn-jsbridge
惠农app适配native api jsbridge
引用
import jsbridge from '@youngbeen/qmhn-jsbridge'
功能列表
- 获取登录信息
- 调起登录
- 获取用户信息
- 设置分享
- 调起分享
- 调起图片上传
- 调起native支付
- 查询是否已收藏当前商品
- 收藏当前商品
- 取消收藏当前商品
- 调起客服聊天
- 跳转native下单
- 获取已选择地址
- 调起地址选择
- 设置title
- 退出webview
- 获取版本号
- 打开loading效果
- 关闭loading效果
- 禁止左右滑动
- 恢复左右滑动
- 禁止上下滑动橡皮糖效果
- 恢复上下滑动橡皮糖效果
- 调用设备震动
- 往native通信
- 注册H5跳转url方法
- 注册H5滚动到页面顶部方法
- 注册H5滚动到页面底部方法
- 注册H5滚动到页面指定元素方法
- 侦听native左上角返回点击 - 暂缓
- 调起返回 - 暂缓
- 侦听软键盘弹起 - 暂缓
- 侦听软键盘收回 - 暂缓
获取登录信息
jsbridge.getLoginInfo()
示例:
let info = jsbridge.getLoginInfo()
console.log(info)
// {
// isLogin: true // 是否已登录
// }
调起登录
jsbridge.userLogin(callback)
示例:
jsbridge.userLogin((data) => {
// 登录回调
console.log(data)
})
// {
// isLogin: true, // 是否已登录
// token: '', // access token
// userCode: '', // 用户编码
// userName: '', // 用户名
// mobileNo: '', // 手机号
// provinceName: '', // 省名称
// provinceCode: '', // 省编码
// }
获取用户信息
jsbridge.getUserInfo(callback)
示例:
jsbridge.getUserInfo((data) => {
// 成功回调
console.log(data)
})
// {
// isLogin: true, // 是否已登录
// token: '', // access token
// userCode: '', // 用户编码
// userName: '', // 用户名
// mobileNo: '', // 手机号
// provinceName: '', // 省名称
// provinceCode: '', // 省编码
// }
设置分享
jsbridge.configShare({
title: '',
detail: '',
imgUrl: '',
url: ''
}, callback)
- title - 分享标题,必选
- detail - 分享副标题,可选
- imgUrl - 分享缩略图url,必选
- url - 分享url,可选,默认当前页面url
示例:
jsbridge.configShare({
title: '分享标题',
detail: '分享副标题',
imgUrl: 'https://image.png',
url: ''
}, (data) => {
// 分享回调
console.log(data)
})
// {
// success: true, // 配置是否成功
// }
调起分享
jsbridge.share({
title: '',
detail: '',
imgUrl: '',
url: ''
}, callback)
- title - 分享标题,必选
- detail - 分享副标题,可选
- imgUrl - 分享缩略图url,必选
- url - 分享url,可选,默认当前页面url
示例:
jsbridge.share({
title: '分享标题',
detail: '分享副标题',
imgUrl: 'https://image.png',
url: ''
}, (data) => {
// 分享回调
console.log(data)
})
// {
// success: true, // 分享是否成功
// channel: 'wechat|qq|weibo' // 分享的渠道
// }
调起图片上传
jsbridge.uploadImage({
type: [],
count: 1
}, callback)
- type - 限定图片来源方式,可选,数组只接受'camera'和'photo'两个值,默认全选['camera', 'photo']
- count - 限定上传图片的张数,可选,默认限定选择一张
示例:
// 限定只从相册上传图片,限定1张
jsbridge.uploadImage({
type: ['photo']
}, (data) => {
// 上传成功回调
console.log(data)
})
// {
// url: [ 'https://uploadedImage.png' ]
// }
// 限定上传3张图片
jsbridge.uploadImage({
count: 3
}, (data) => {
// 上传成功回调
...
})
调起native支付
jsbridge.pay({
order: '',
amount: 1,
channel: []
}, callback)
- order - 订单号,必选
- amount - 金额,必选,单位为分
- channel - 支持的支付渠道,必选,可选值 'umspay' - 账户支付, 'alipay' - 支付宝支付, 'wxpay' - 微信支付, 'unionpay' - 云闪付支付
示例:
jsbridge.pay({
order: '201829392939123', // 订单号
amount: '100', // 金额,单位分
channel: ['umspay', 'alipay', 'wxpay', 'unionpay'] // 支付渠道
}, (data) => {
// 支付回调
console.log(data)
})
// {
// success: true
// }
查询是否已收藏当前商品
jsbridge.hasBookmarked(goodDetail)
- goodDetail - 整个商品的详情数据json,必选,json对象
示例:
let info = jsbridge.hasBookmarked({
...
})
console.log(info)
// {
// success: true
// }
收藏当前商品
jsbridge.bookmark(goodDetail)
- goodDetail - 整个商品的详情数据json,必选,json对象
示例:
let info = jsbridge.bookmark({
...
})
console.log(info)
// {
// success: true
// }
取消收藏当前商品
jsbridge.unbookmark(goodDetail)
- goodDetail - 整个商品的详情数据json,必选,json对象
示例:
let info = jsbridge.unbookmark({
...
})
console.log(info)
// {
// success: true
// }
调起客服聊天
jsbridge.serviceDesk(mobileNo)
- mobileNo - 客服手机号,必选,字符串
该方法无返回!
示例:
jsbridge.serviceDesk('12311112222')
跳转native下单
jsbridge.redirectNativeOrderPage(goodInfo)
- goodInfo - 商品具体信息,必选,js对象
示例:
let info = jsbridge.redirectNativeOrderPage({
productCode: '123233323',
...
})
console.log(info)
// {
// success: true
// }
获取已选择地址
jsbridge.getAddress()
示例:
let address = jsbridge.getAddress()
console.log(address)
// {
// countryCode: '', // 国家编码
// countryName: '', // 国家名称
// provinceCode: '' // 省编码
// provinceName: '', // 省名称
// cityCode: '', // 市编码
// cityName: '', // 市名称
// districtCode: '', // 区编码(可选返回)
// districtName: '' // 区名称(可选返回)
// }
调起地址选择
jsbridge.selectAddress(callback)
示例:
jsbridge.selectAddress((data) => {
// 选择城市回调
console.log(data)
})
// {
// countryCode: '', // 国家编码
// countryName: '', // 国家名称
// provinceCode: '' // 省编码
// provinceName: '', // 省名称
// cityCode: '', // 市编码
// cityName: '', // 市名称
// districtCode: '', // 区编码(可选返回)
// districtName: '' // 区名称(可选返回)
// }
设置title
jsbridge.setNavigationBar({
title: '标题内容',
bgColor: '#000',
type: ''
})
- title - 标题内容,必选,可为空,默认为空
- bgColor - 标题栏背景色,可选,默认不设置不改变(只接受#开头的十六进制颜色值,大小写不区分)
- type - 类型,可选,默认不设置(可选值 'good' | 'normal')
示例:
jsbridge.setNavigationBar({
title: '测试title',
bgColor: '#52bea6'
})
退出webview
jsbridge.closeWebview()
获取版本号
jsbridge.getAppVersion()
示例:
let info = jsbridge.getAppVersion()
console.log(info)
// {
// version: '1.0.0'
// }
打开loading效果
jsbridge.showLoading()
关闭loading效果
jsbridge.hideLoading()
禁止左右滑动
jsbridge.disableFlipBack()
恢复左右滑动
jsbridge.enableFlipBack()
禁止上下滑动橡皮糖效果
jsbridge.disableSlide()
恢复上下滑动橡皮糖效果
jsbridge.enableSlide()
调用设备震动
jsbridge.vibrate(type)
- type - 震动类型,可选,有效值 'long' | 'short',默认short短震动
示例:
jsbridge.vibrate() // 短震动
jsbridge.vibrate('long') // 长震动
往native通信
jsbridge.communicateToNative(id, [data])
- id - 信息id,必选,字符串
- data - 附加业务信息,可选,json结构
示例:
jsbridge.communicateToNative('moveToGood') // 通知native 页面已经滚动到商品区域
jsbridge.communicateToNative('hello', {
name: 'h5',
type: 'message'
}) // 附加一些信息
注册H5跳转url方法
使用该方法后,native可以直接调用
redirectUrl
来触发H5跳转url操作
H5注册: jsbridge.registerRedirectUrl()
native调用:
redirectUrl(url)
- url - 要跳转的url地址,必选,以#开头的url内容认定为单页面应用跳转
注册H5滚动到页面顶部方法
使用该方法后,native可以直接调用
scrollToTop
来触发H5滚动到页面顶部操作
H5注册: jsbridge.registerScrollToTop()
native调用:
scrollToTop()
注册H5滚动到页面底部方法
使用该方法后,native可以直接调用
scrollToBottom
来触发H5滚动到页面底部操作
H5注册: jsbridge.registerScrollToBottom()
native调用:
scrollToBottom()
注册H5滚动到页面指定元素方法
使用该方法后,native可以直接调用
scrollToElement
来触发H5滚动到页面指定元素操作
H5注册: jsbridge.registerScrollToElement()
native调用:
scrollToElement(id)
- id - 要滚动的指定元素的id,必选