React Native bridging library that integrates WeChat SDKs:
react-native-wechat has the following tracking data in the open source world:
NPM | Dependency | Downloads | Build |
---|---|---|---|
react-native-wechat uses Promises, therefore you can use Promise
or async/await
to manage your dataflow.
appid
{String} the appid you get from WeChat dashboardThis method should be called once globally.
import * as WeChat from 'react-native-wechat';
WeChat.registerApp('appid');
appid
{String} the appid you get from WeChat dashboarddescription
{String} the description of your appThis method is only available on iOS.
Check if the WeChat app is installed on the device.
Check if wechat support open url.
Get the WeChat SDK api version.
Open the WeChat app from your application.
scope
{Array|String} Scopes of auth request.state
{String} the state of OAuth2Send authentication request, and it returns an object with thefollowing fields:
field | type | description |
---|---|---|
errCode | Number | Error Code |
errStr | String | Error message if any error occurred |
openId | String | |
code | String | Authorization code |
url | String | The URL string |
lang | String | The user language |
country | String | The user country |
ShareMetadata
title
{String} title of this message.type
{Number} type of this message. Can be {news|text|imageUrl|imageFile|imageResource|video|audio|file}thumbImage
{String} Thumb image of the message, which can be a uri or a resource id.description
{String} The description about the sharing.webpageUrl
{String} Required if type equals news
. The webpage link to share.imageUrl
{String} Provide a remote image if type equals image
.videoUrl
{String} Provide a remote video if type equals video
.musicUrl
{String} Provide a remote music if type equals audio
.filePath
{String} Provide a local file if type equals file
.fileExtension
{String} Provide the file type if type equals file
.message
{ShareMetadata} This object saves the metadata for sharingShare a ShareMetadata
message to timeline(朋友圈) and returns:
name | type | description |
---|---|---|
errCode | Number | 0 if authorization successed |
errStr | String | Error message if any error occurred |
The following examples require the 'react-native-chat' and 'react-native-fs' packages.
import * as WeChat from 'react-native-wechat';
import fs from 'react-native-fs';
let resolveAssetSource = require('resolveAssetSource');
// Code example to share text message:
try {
let result = await WeChat.shareToTimeline({
type: 'text',
description: 'hello, wechat'
});
console.log('share text message to time line successful:', result);
} catch (e) {
if (e instanceof WeChat.WechatError) {
console.error(e.stack);
} else {
throw e;
}
}
// Code example to share image url:
// Share raw http(s) image from web will always fail with unknown reason, please use image file or image resource instead
try {
let result = await WeChat.shareToTimeline({
type: 'imageUrl',
title: 'web image',
description: 'share web image to time line',
mediaTagName: 'email signature',
messageAction: undefined,
messageExt: undefined,
imageUrl: 'http://www.ncloud.hk/email-signature-262x100.png'
});
console.log('share image url to time line successful:', result);
} catch (e) {
if (e instanceof WeChat.WechatError) {
console.error(e.stack);
} else {
throw e;
}
}
// Code example to share image file:
try {
let rootPath = fs.DocumentDirectoryPath;
let savePath = rootPath + '/email-signature-262x100.png';
console.log(savePath);
/*
* savePath on iOS may be:
* /var/mobile/Containers/Data/Application/B1308E13-35F1-41AB-A20D-3117BE8EE8FE/Documents/email-signature-262x100.png
*
* savePath on Android may be:
* /data/data/com.wechatsample/files/email-signature-262x100.png
**/
await fs.downloadFile('http://www.ncloud.hk/email-signature-262x100.png', savePath);
let result = await WeChat.shareToTimeline({
type: 'imageFile',
title: 'image file download from network',
description: 'share image file to time line',
mediaTagName: 'email signature',
messageAction: undefined,
messageExt: undefined,
imageUrl: "file://" + savePath // require the prefix on both iOS and Android platform
});
console.log('share image file to time line successful:', result);
} catch (e) {
if (e instanceof WeChat.WechatError) {
console.error(e.stack);
} else {
throw e;
}
}
// Code example to share image resource:
try {
let imageResource = require('./email-signature-262x100.png');
let result = await WeChat.shareToTimeline({
type: 'imageResource',
title: 'resource image',
description: 'share resource image to time line',
mediaTagName: 'email signature',
messageAction: undefined,
messageExt: undefined,
imageUrl: resolveAssetSource(imageResource).uri
});
console.log('share resource image to time line successful', result);
}
catch (e) {
if (e instanceof WeChat.WechatError) {
console.error(e.stack);
} else {
throw e;
}
}
// Code example to download an word file from web, then share it to WeChat session
// only support to share to session but time line
// iOS code use DocumentDirectoryPath
try {
let rootPath = fs.DocumentDirectoryPath;
let fileName = 'signature_method.doc';
/*
* savePath on iOS may be:
* /var/mobile/Containers/Data/Application/B1308E13-35F1-41AB-A20D-3117BE8EE8FE/Documents/signature_method.doc
**/
let savePath = rootPath + '/' + fileName;
await fs.downloadFile('https://open.weixin.qq.com/zh_CN/htmledition/res/assets/signature_method.doc', savePath);
let result = await WeChat.shareToSession({
type: 'file',
title: fileName, // WeChat app treat title as file name
description: 'share word file to chat session',
mediaTagName: 'word file',
messageAction: undefined,
messageExt: undefined,
filePath: savePath,
fileExtension: '.doc'
});
console.log('share word file to chat session successful', result);
} catch (e) {
if (e instanceof WeChat.WechatError) {
console.error(e.stack);
} else {
throw e;
}
}
//android code use ExternalDirectoryPath
try {
let rootPath = fs.ExternalDirectoryPath;
let fileName = 'signature_method.doc';
/*
* savePath on Android may be:
* /storage/emulated/0/Android/data/com.wechatsample/files/signature_method.doc
**/
let savePath = rootPath + '/' + fileName;
await fs.downloadFile('https://open.weixin.qq.com/zh_CN/htmledition/res/assets/signature_method.doc', savePath);
let result = await WeChat.shareToSession({
type: 'file',
title: fileName, // WeChat app treat title as file name
description: 'share word file to chat session',
mediaTagName: 'word file',
messageAction: undefined,
messageExt: undefined,
filePath: savePath,
fileExtension: '.doc'
});
console.log('share word file to chat session successful', result);
}
catch (e) {
if (e instanceof WeChat.WechatError) {
console.error(e.stack);
} else {
throw e;
}
}
message
{ShareMetadata} This object saves the metadata for sharingSimilar to shareToTimeline
but sends the message to a friend or chat group.
payload
{Object} the payment data
partnerId
{String} 商家向财付通申请的商家IDprepayId
{String} 预支付订单IDnonceStr
{String} 随机串timeStamp
{String} 时间戳package
{String} 商家根据财付通文档填写的数据和签名sign
{String} 商家根据微信开放平台文档对数据做的签名Sends request for proceeding payment, then returns an object:
name | type | description |
---|---|---|
errCode | Number | 0 if authorization successed |
errStr | String | Error message if any error occurred |
$ npm install react-native-wechat --save
React Native Starter Kit - is a mobile starter kit that allows your team to fully focus on development of the features that set your product apart from the competitors instead of building your app from scratch.
GitHub | Role | |
---|---|---|
@yorkie | Author | yorkiefixer@gmail.com |
@xing-zheng | Emeriti | |
@tdzl2003 | Emeriti | tdzl2003@gmail.com |
MIT
本文向大家介绍react-native 启动React Native Packager,包括了react-native 启动React Native Packager的使用技巧和注意事项,需要的朋友参考一下 示例 在最新版本的React Native上,无需运行打包程序。它将自动运行。 默认情况下,这将在端口8081上启动服务器。要指定服务器所在的端口
百度移动统计SDK支持使用react native框架的H5页面统计,封装好的插件已经在github上开源,相关用法具体请参考:https://github.com/BaiduMobileAnalysis/baidumobstat-react-native。
The React Native environment has a lot of little quirks, so this documentation is aimed at helping smooth those over. Please feel free to create issues on GitHub for recommendations and additions to t
React Native 可以基于目前大热的开源JavaScript库React.js来开发iOS和Android原生App。而且React Native已经用于生产环境——Facebook Groups iOS 应用就是基于它开发的。 React Native的原理是在JavaScript中用React抽象操作系统原生的UI组件,代替DOM元素来渲染,比如以<View>取代<div>,以<Ima
本文向大家介绍react-native setState,包括了react-native setState的使用技巧和注意事项,需要的朋友参考一下 示例 要在应用程序中更改视图,可以使用setState-这将重新渲染您的组件及其任何子组件。setState在新状态和先前状态之间执行浅表合并,并触发组件的重新呈现。 setState 接受键值对象或返回键值对象的函数 键值对象 功能 使用函数对于基于
诸葛io移动统计支持React Native插件,以下为集成方法。 1. 环境准备 1.1. iOS环境 iOS 8.0+ 代码支持iOS8.0的系统 pod 1.0+ iOS系统的集成依赖于cocoaPod工具 1.2. Android环境 Android SDK 16+ 代码支持Android 16+ 1.3. React Native环境 react-native 0.50+ react-n