网上看了很多相关文章大多数都是通过集成微信SDK来实现分享功能的,对于我们这种新手小白和对RN Java底层不熟悉的小伙伴来说就显得有些痛苦。偶然间笔者发现了一个简便方法,就使的这一过程轻松了‘亿’点点。
1.集成@shm-open/react-native-wechat
安装方式:npm i @shm-open/react-native-wechat
使用方法:
1.先在项目中引入@shm-open/react-native-wechat
import * as WeChat from '@shm-open/react-native-wechat';
2.注册wechat (注意:一定要注册不然会报错)
WeChat.registerApp(appId: string, universalLink: string);
// appId:即应用的appId:wxe.... universalLink:应用api接口网址 https://...
3.调用相关方法
async function JumpToMiniProgram(type) {
WeChat.registerApp(Config.WECHAT_APIKEY, Config.UNIVERSAL_LINK);//注册wechat
// 判断是否安装微信
const flag = await WeChat.isWXAppInstalled(); // flag==true 已安装微信
if (!flag) {
return showToast({
position: 'bottom',
message: `您还未安装微信`,
});
}
// 分享图片到微信好友
WeChat.shareImage({
scene: 0, //识别分享方式 0:微信好友 1:微信朋友圈 2:微信收藏
imageUrl: ImgUri,
}).then((res) => {
//分享后的操作
if (res.errCode !== 0) {
//我的弹窗提示方法,你们可改为自己的方法
showToast({
position: 'bottom',
message: `分享失败`,
});
}
})
}
只需要改变scene的值即可实现不同的分享方法。
4.注意:如果你集成了@shm-open/react-native-wechat 同时还去引用了微信的SDK在你的项目中则会报错,提示你SDK冲突,因为@shm-open/react-native-wechat已经引用了微信的SDK。
其他用法:@shm-open/react-native-wechat不光集成了微信的分享功能,同时还有很多实用的功能。
打开小程序:
WeChat.openMiniprogram({
userName: 'gh_2...', //小程序的appId
path: 'pages/pagehome/pagehome', //打开小程序的那个页面
miniprogramType: 0, //小程序的类型 RELEASE = 0,TEST = 1,PREVIEW = 2
});
微信支付功能:
WeChat.pay({
appId: Config.WECHAT_APIKEY,
partnerId: date.mchid,
prepayId: date.prepayID,
nonceStr: date.nonceStr,
timeStamp: JSON.stringify(date.timeStamp),
package: date.package,
sign: date.paySign,
})
分享文本:
WeChat.shareText({
text: string;
scene: WechatSceneEnum;
})
分享网页:
WeChat.shareWebpage({
webpageUrl: string;
thumbImageUrl: string;
scene: WechatSceneEnum;
})
分享小程序:
WeChat.shareMiniprogram({
webpageUrl: string;
thumbImageUrl: string;
miniprogram: WechatOpenMiniprogram;
})
分享Video:
WeChat.shareVideo({
videoUrl?: string;
videoLowBandUrl?: string;
thumbImageUrl?: string;
})
// videoUrl和videoLowBandUrl不能同时为空
分享Music:
WeChat.shareMusic({
musicUrl?: string;
musicLowBandUrl?: string;
musicDataUrl?: string;
musicLowBandDataUrl?: string;
thumbImageUrl?: string;
})
//musicUrl和musicLowBandUrl不能同时为空
微信签约:
WeChat.entrust({
preEntrustWebId: string;
})
上述方法其中有些笔者也并未使用,相关注意事项待笔者日后使用时补充,要是有小伙伴在使用时遇到问题欢迎留言讨论!