转载链接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/react-native-open-source-components-react-native-wechat-learning/

由于最近工作的需要用到微信分享,于是我就找开源组件库(react-native-wechat),下面是具体的使用方法。

一、进入到项目的目录中执行如下命令:

$ npm install react-native-wechat --save

二、IOS:打开你的Xcode工程

2.1 从node_modules/react-native-wechat/ios中链接RCTWeChat到库文件中,不要忘记将它添加到"Buid Phases"中(如下图所示。注:具体的可以参考facebook官网的方法http://facebook.github.io/react-native/docs/linking-libraries-ios.html)

 

 

2.2 添加一下库文件(Build Phase->Link Binary With Libraries):SystemConfiguration.framework,CoreTelephony.framework ,libsqlite3.0,libc++,libz  

2.3添加app id (Targets->info->URL types)注:URL Schemes填写的是APP ID 需要去微信开发者平台注册。

2.4为了适配IOS9需要在LSApplicationQueriesSchemes (Target-info-Custom IOS Target Properties)添加微信为白名单。我们需要修改info.plist文件,

然后添加如下的代码:

LSApplicationQueriesSchemes
 
    
    wechat
    weixin
    
    sinaweibohd
    sinaweibo
    sinaweibosso
    weibosdk
    weibosdk2.5
    
    mqqapi
    mqq
    mqqOpensdkSSoLogin
    mqqconnect
    mqqopensdkdataline
    mqqopensdkgrouptribeshare
    mqqopensdkfriend
    mqqopensdkapi
    mqqopensdkapiV2
    mqqopensdkapiV3
    mqzoneopensdk
    wtloginmqq
    wtloginmqq2
    mqqwpa
    mqzone
    mqzonev2
    mqzoneshare
    wtloginqzone
    mqzonewx
    mqzoneopensdkapiV2
    mqzoneopensdkapi19
    mqzoneopensdkapi
    mqzoneopensdk
    
    alipay
    alipayshare

2.5因为需要使用LinkingIOS,还需要在AppDelegate.m中添加如下代码:

#import "../Libraries/LinkingIOS/RCTLinkingManager.h"

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation {

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

}

三、API文档

3.1 registerApp(appid)
	{string} appid  你的appid
	return {promise} 返回一个promise对象
3.2 registerAppWithDescription(appid,appdesc) ->仅支持IOS
	{string} appid  (同上)
	{String} appdesc 你的app的说明
	return {promise}
3.3 isWXAppInstalled() 检查微信是否初始化
3.4 isWXAppSupportApi()检查微信是否支持url
3.5 getApiVersion()    获得微信SDK的版本
3.6 openWXApp()        打开微信app
3.7 sendAuthRequest([scope[,state]]) 发送默认请求,scope:登录时所申请的权限默认为get_simple_userinfo.需要
多个权限的时候以逗号分隔开。

3.8  shareToTimeline(data) 分享信息到朋友圈

      {Object } data 包含以下发送信息

       {string} thumbImage  可以是一个uri或者资源id

       {string} type  信息的类型,可以是 {news|text|p_w_picpathUrl|p_w_picpathFile|p_w_picpathResource|video|audio|file}

       {string} webpageUrl  如果类型是news,分享一个网页链接

       {string}  p_w_picpathUrl      如果类型是p_w_picpath,提供一个远程的图片链接

       {string}  videoUrl       如果类型是video,提供一个视频

       {string} musicUrl        如果是audio,提供一个音乐

       {string} filePath          提供本地文件

以下例子需要'react-native-wechat'和'react-native-fs'组件

import * as WeChat from 'react-native-wechat';
import fs from 'react-native-fs';
var resolveAssetSource = require('resolveAssetSource'); // along with Image component
// Code example to share text message:
try {
    var result = await  WeChat.shareToTimeline({type: 'text', description: 'I\'m Wechat, :)'});
    console.log('share text message to time line successful', result);
}
catch (e) {
    console.log('share text message to time line failed', e);
}

// Code example to share p_w_picpath url:
// Share raw http(s) p_w_picpath from web will always fail with unknown reason, please use p_w_picpath file or p_w_picpath resource instead
try {
    var result = await WeChat.shareToTimeline({
        type: 'p_w_picpathUrl',
        title: 'web p_w_picpath',
        description: 'share web p_w_picpath to time line',
        mediaTagName: 'email signature',
        messageAction: undefined,
        messageExt: undefined,
        p_w_picpathUrl: 'http://www.ncloud.hk/email-signature-262x100.png'
    });
    console.log('share p_w_picpath url to time line successful', result);
}
catch (e) {
    console.log('share p_w_picpath url to time line failed', e);
}

// Code example to share p_w_picpath file:
try {
    var rootPath = fs.DocumentDirectoryPath;
    var savePath = rootPath + '/email-signature-262x100.png'; // like /var/mobile/Containers/Data/Application/B1308E13-35F1-41AB-A20D-3117BE8EE8FE/Documents/email-signature-262x100.png

    await fs.downloadFile('http://www.ncloud.hk/email-signature-262x100.png', savePath);

    var result = await WeChat.shareToTimeline({
        type: 'p_w_picpathFile',
        title: 'p_w_picpath file download from network',
        description: 'share p_w_picpath file to time line',
        mediaTagName: 'email signature',
        messageAction: undefined,
        messageExt: undefined,
        p_w_picpathUrl: savePath
    });

    console.log('share p_w_picpath file to time line successful', result);
}
catch (e) {
    console.log('share p_w_picpath file to time line failed', e);
}

// Code example to share p_w_picpath resource:
try {
    var p_w_picpathResource = require('./email-signature-262x100.png');
    var result = await WeChat.shareToTimeline({
        type: 'p_w_picpathResource',
        title: 'resource p_w_picpath',
        description: 'share resource p_w_picpath to time line',
        mediaTagName: 'email signature',
        messageAction: undefined,
        messageExt: undefined,
        p_w_picpathUrl: resolveAssetSource(p_w_picpathResource).uri
    });
    console.log('share resource p_w_picpath to time line successful', result);
}
catch (e) {
    console.log('share resource p_w_picpath to time line failed', e);
}

  3.9 shareToSession(data) 用法和shareToTimeline用法相似,发送信息给一个朋友或者群组

  3.10 addListener(eventType,listener[,context]) 当事件触发时,会调用一个监听器,返回一个对象

  3.11  once(eventType,listener[,context]) 用法和addListener相似

  3.12  removeAllListener()   删除所有的注册监听器