您的位置:首页 > Web前端 > React

快速集成 react-native 的微信分享

2016-10-31 08:48 826 查看
1.首先开发者需要在微信开放平台申请自己的 appid,这一步骤跳过.
2.在终端下载,并关联

npm install react-native-wechat --save

rnpm link react-native-wechat

微信分享需要0.35版本以上,若版本过低则先要升级(升级参考地址)

3.在 app delegate.m 中导入

<span style="font-size:18px;">#import "../Libraries/LinkingIOS/RCTLinkingManager.h"</span>

 并且添加

<span style="font-size:18px;">- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation {

return [RCTLinkingManager application:application openURL:url sourceApplication:sourceApplication annotation:annotation];

}</span>


4.在 Xcode 中配置分享到微信的一些参数.





 到这里 Xcode 需要的操作已经完成了.

5.找到需要分享功能的页面,引入刚刚下载的头文件

<span style="font-size:18px;">import * as WeChat from 'react-native-wechat';</span>


在这里可以点击react-native-wechat 查看 API.

这里主要用到三个 api

(1).注册

<span style="font-size:18px;">WeChat.registerApp('申请得到的 appid');</span>
(2).判断微信是否安装,如未安装则提示

(3).进行分享.这里分享的类型参数在 api 中注释得都很清晰

<span style="font-size:18px;"> WeChat.isWXAppInstalled()
.then((isInstalled) => {
if (isInstalled) {
WeChat.shareToTimeline({
title: title,
description: description,
thumbImage: thumbImage,
type: 'news',
webpageUrl: url
})
.catch((error) => {
// error.message;
});
} else {
//没有安装微信软件,请您安装微信之后再试;
}
});</span>
需要注意的一点,registerApp 方法不要写在需要分享的页面中,因为注册只需注册一次就够了,若写在了分享页面,多次进行分享后会出现黄色警告,提示 appid 已经注册过.

最终继承后的效果如下:

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: