react-native 的版本为 0.61.5
由于官网上的使用步骤不够详细,因此将项目中的正确使用摘选出来,方便大家的使用。
jmessage-react-plugin的github地址
极光推送 react-native 版本
- 安装依赖
yarn add jmessage-react-plugin jcore-react-native
- 配置
android\app\src\main\AndroidManifest.xml
加入以下代码
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" /> <!-- 极光的配置 --> <meta-data android:name="JPUSH_CHANNEL" android:value="${APP_CHANNEL}" /> <meta-data android:name="JPUSH_APPKEY" android:value="${JPUSH_APPKEY}" /> <!-- 极光的配置 --> </application>
android\app\build.gradle
加入以下代码和按需修改
android { compileSdkVersion rootProject.ext.compileSdkVersion compileOptions { sourceCompatibility JavaVersion.VERSION_1_8 targetCompatibility JavaVersion.VERSION_1_8 } defaultConfig { applicationId "com.awesomeproject" minSdkVersion rootProject.ext.minSdkVersion targetSdkVersion rootProject.ext.targetSdkVersion versionCode 1 versionName "1.0" manifestPlaceholders = [ JPUSH_APPKEY: "你的 appKey", //在此替换你的APPKey APP_CHANNEL: "developer-default" //应用渠道号 ] }
dependencies { implementation fileTree(dir: "libs", include: ["*.jar"]) implementation "com.facebook.react:react-native:+" // From node_modules compile project(':jmessage-react-plugin') // 新增的 compile project(':jcore-react-native') // 新增的 if (enableHermes) { def hermesPath = "../../node_modules/hermes-engine/android/"; debugImplementation files(hermesPath + "hermes-debug.aar") releaseImplementation files(hermesPath + "hermes-release.aar") } else { implementation jscFlavor } }
- 根目录下新建文件和添加以下配置
react-native.config.js
module.exports = { dependencies: { 'jmessage-react-plugin': { platforms: { android: { packageInstance: 'new JMessageReactPackage(false)' } } }, } };
android\settings.gradle
加入如下配置
include ':jmessage-react-plugin' project(':jmessage-react-plugin').projectDir = new File(rootProject.projectDir, '../node_modules/jmessage-react-plugin/android') include ':jcore-react-native' project(':jcore-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/jcore-react-native/android')
- 在 根组件中进行测试
App.js
import React from 'react'; import { View, Text } from "react-native"; import JMessage from "jmessage-react-plugin"; class App extends React.Component { componentDidMount() { JMessage.init({ 'appkey': 'key', 'isOpenMessageRoaming': true, 'isProduction': false, 'channel': '' }) JMessage.login({ username: "名称", password: "密码" }, (res) => { console.log("登录成功"); console.log(res); }, (err) => { console.log("登录失败"); console.log(err); }) } render() { return ( <View> <Text>goods</Text> </View> ); } } export default App;