本文转载自:https://www.jianshu.com/p/6a792118fae4
如果出现undefined is not an object(evaluating 'WeChat.registerApp'),解决办法如下:
1、下载react-native-wechat包,yarn add react-native-wechat;
2、执行自动配置命令:react-native link react-native-wechat,(执行成功会显示react-native-wechat ios dependency);
如果自动配置出错,可以手动配置
接下来看手动配置方法:
接下来看手动配置方法:
1.点击Libraries右侧的ADD Files to
选择如下内容:
2.在工程Build Phases ➜ Link Binary With Libraries中添加libRCTWeChat.a
3.在工程target的Build Phases->Link Binary with Libraries中加入下面库文件:
SystemConfiguration.framework
CoreTelephony.framework
libsqlite3.0
libc++
libz
4.在TARGETS 下项目名 -> info ,添加我们申请得到的微信 AppId填写在 "URL type"的"URL Schema"处,ldentifier填写为:weixin
5.iOS9 以上,添加 微信白名单
6.在项目的AppDelegate.m添加以下代码,启动[LinkingIOS]
#import <React/RCTLinkingManager.h>
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url
sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
return [RCTLinkingManager application:application openURL:url
sourceApplication:sourceApplication annotation:annotation];
}
配置完成了,累死宝宝了~~~
接下来就是运用:
在组件内引入:import * as WeChat from 'react-native-wechat'
并且在构造函数内添加你的appid:WeChat.registerApp('你的appid');
如下图:
然后就是点击分享了:
先自定义一个组件(为了复用,缩减代码):
class OButton extends Component {
render() {
return (
<TouchableHighlight
style={styles.button}
underlayColor="#a5a5a5"
onPress={this.props.onPress}>
<Text style={styles.buttonText}>{this.props.text}</Text>
</TouchableHighlight>
);
}
}
使用组件:
<View style={{margin:20}}>
<Text style={styles.welcome}>
微信分享
</Text>
<OButton text='微信好友分享的文本'
onPress={() => {
WeChat.isWXAppInstalled()
.then((isInstalled) => {
if (isInstalled) {
WeChat.shareToSession({type: 'text', description: '测试微信好友分享的文本内容'})
.catch((error) => {
Alert.alert(error.message);
});
} else {
Alert.alert('请安装微信');
}
});
}}
/>
<OButton text='微信好友分享链接'
onPress={() => {
WeChat.isWXAppInstalled()
.then((isInstalled) => {
if (isInstalled) {
WeChat.shareToSession({
title:'微信好友测试的链接',
description: '分享的标题内容',
thumbImage: '分享的标题图片',
type: 'news',
webpageUrl: '分享的链接'
})
.catch((error) => {
Alert.alert(error.message);
});
} else {
Alert.alert('请安装微信');
}
});
}}
/>
<OButton text='微信朋友圈分享的文本'
onPress={() => {
WeChat.isWXAppInstalled()
.then((isInstalled) => {
if (isInstalled) {
WeChat.shareToTimeline({type: 'text', description: '测试微信朋友圈分享的文本内容'})
.catch((error) => {
Alert.alert(error.message);
});
} else {
Alert.alert('请安装微信');
}
});
}}
/>
<OButton text='微信朋友圈分享的链接'
onPress={() => {
WeChat.isWXAppInstalled()
.then((isInstalled) => {
if (isInstalled) {
WeChat.shareToTimeline({
title:'分享的标题',
description: '分享的标题内容',
thumbImage: '分享的标题图片',
type: 'news',
webpageUrl: '分享的链接'
})
.catch((error) => {
Alert.alert(error.message);
});
} else {
Alert.alert('请安装微信');
}
});
}}
/>
<OButton text='微信支付'
onPress={() => {
WeChat.isWXAppInstalled()
.then((isInstalled) => {
if (isInstalled) {
WeChat.pay({
partnerId: 'xxxxxx', // 商家向财付通申请的商家id
prepayId: 'xxxxxx', // 预支付订单
nonceStr:'xxxxxx', // 随机串,防重发
timeStamp: 'xxxxxxx' , // 时间戳,防重发.
package: 'Sign=WXPay', // 商家根据财付通文档填写的数据和签名
sign: 'xxxxxxxxx' // 商家根据微信开放平台文档对数据做的签名
}).then((requestJson)=>{
//支付成功回调
if (requestJson.errCode=="0"){
//回调成功处理
}
}).catch((err)=>{
Alert.alert('支付失败')
})
} else {
Alert.alert('请安装微信');
}
});
}}
/>
</View>
最后再给大家说一个小bug,若是出现点击微信分享闪退问题时,请检查你app的签名是否正确,因为开发版和公布版的签名是不一致的,需要改成公布版的,签名获取方式微信开放平台有apk。
如果还是闪退,终极大招!!!清除微信缓存就好了!!!亲测有效!!!