react-native-mob-sharesdk
v1.0.8
Published
react native sharesdk
Downloads
4
Maintainers
Readme
react-native-sharesdk
share sdk for react-native
install
npm i react-native-sharesdk --save
link
react-native link react-native-sharesdk
IOS
qq 微信登录
打开Xcode app项目文件夹, 找到路径为
node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK
的目录 并且拖动到Libraries
目录,不要勾选'copy items if needed'。在项目中找到"Build Settings"这一栏, 继续往下找到"Framework Search Paths" 这一节,加入以下这些路径值:
$(SRCROOT)/../node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK
,$(SRCROOT)/../node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK/Support/Optional
,$(SRCROOT)/../node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK/Support/PlatformConnector
,$(SRCROOT)/../node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK/Support/Required
,$(SRCROOT)/../node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK/Support/PlatformSDK/QQSDK
, 继续找到"Library Search Paths" 这一节,加入以下这些路径值:$(SRCROOT)/../node_modules/react-native-sharesdk/ios/rnsharesdk/ShareSDK/Support/PlatformSDK/WeChatSDK
,
3.在项目中找到"Build Phases"这一栏, 继续往下找到"Link Binary With Libraries"这一节,加入以下这些库:
libicucore.tbd, libz.tbd, libstdc++.tbd, JavaScriptCore.framework, libsqlite3.tbd
具体依赖如下图
4.在项目中找到"Info"这一栏, 继续往下找到"URL Types"这一节,点击"+"号添加一栏数据,填入qq appid,微信app key
例如:tencent100371282
, 100371282 是qq appid.
5.Under the "Info" tab of your project configuration, add LSApplicationQueriesSchemes of type Array For QQ SDK.
items details from LSApplicationQueriesSchemes
6.specify your sharesdk appkey, qq appid and appkey in node_modules/react-native-sharesdk/ios/rnsharesdk/MobLogin.m
[ShareSDK registerApp:@"iosv1101"
onConfiguration:^(SSDKPlatformType platformType, NSMutableDictionary *appInfo) {
switch (platformType)
{
case SSDKPlatformTypeQQ:
[appInfo SSDKSetupQQByAppId:@"100371282"
appKey:@"aed9b0303e3ed1e27bae87c33761161d"
authType:SSDKAuthTypeBoth];
break;
default:
break;
}
}];
ANDROID
qq login
- specify your qq AppId in
node_modules/react-native-sharesdk/android/build.gradle
defaultConfig {
...
manifestPlaceholders = [
QQ_APP_ID: "100371282", //qq AppId
]
}
- specify your sharesdk appkey in
node_modules/react-native-sharesdk/android/src/main/assets/ShareSDK.xml
<ShareSDK
AppKey = "androidv1101"/> <!-- 修改成你在sharesdk后台注册的应用的appkey"-->
- specify your qq appid and appkey in
node_modules/react-native-sharesdk/android/src/main/assets/ShareSDK.xml
<!-- ShareByAppClient标识是否使用微博客户端分享,默认是false -->
<QQ
Id="7"
SortId="7"
AppId="100371282"
AppKey="aed9b0303e3ed1e27bae87c33761161d"
ShareByAppClient="true"
Enable="true" />
usage
...
import { NativeModules } from 'react-native'
const {MobLogin} = NativeModules
...
_onPressQQLogin() {
MobLogin.loginWithQQ().then((data) => {
console.log('token: ', data.token)
console.log('user_id: ', data.user_id)
console.log('user_name: ', data.user_name)
console.log('user_gender: ', data.user_gender)
console.log('user_icon: ', data.user_icon)
}, (err) => {
console.log(err)
})
}
_onPressWeChatLogin() {
MobLogin.loginWithWeChat().then((data) => {
console.log('token: ', data.token)
console.log('user_id: ', data.user_id)
console.log('user_name: ', data.user_name)
console.log('user_gender: ', data.user_gender)
console.log('user_icon: ', data.user_icon)
}, (err) => {
console.log(err)
})
}
_onPressShare() {
MobLogin.showShare('我是标题', '分享什么内容')
}
render() {
return (
<View style={styles.container}>
<TouchableOpacity style={styles.qqlogin} onPress={()=>this._onPressLogin()}>
<Text style={{fontSize: 18, color: 'black'}}>QQLogin</Text>
</TouchableOpacity>
....
</View>
)
}