博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
React Native 轻松集成统计功能(Android 篇)
阅读量:7174 次
发布时间:2019-06-29

本文共 3661 字,大约阅读时间需要 12 分钟。

关于推送的集成请参考,本篇文章将引导你集成统计功能,只需要简单的三个步骤就可以集成统计功能。

第一步 安装

在你的项目路径下执行命令:

npm install janalytics-react-native --savenpm install jcore-react-native --savereact-native link

执行完上述命令后,使用 Android Studio 打开你的项目。

第二步 配置:

2.1 配置 settings.gradle
执行完 link 命令后,如果 link 失败,则需要手动打开 settings.gradle 文件,完成以下配置:

your project/settings.gradle

include ':app', 'janalytics-react-native', 'jcore-react-native'project(':janalytics-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/janalytics-react-native/android')project(':jcore-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/jcore-react-native/android')

2.2 配置 build.gradle

your project/android/app/build.gradle

android {  ...  defaultConfig {    applicationId "your application id"    ...    manifestPlaceholders = [      JPUSH_APPKEY: "your app key", //在此替换你的APPKey      JPUSH_CHANNEL: "developer-default",       //应用渠道号, 默认即可    ]  }}...dependencies {  compile project(':janalytics-react-native')  compile project(':jcore-react-native')}

2.3 配置 AndroidManifest.xml

your project/AndroidManifest.xml

...
...
...

到此为止配置已经完成了,现在 sync 一下项目即可看到 janalytics 和 jcore 两个库出现在自己的项目下。

图片描述

第三步 使用

3.1 加入 JAnalyticsPackage:

your project/app/MainApplication.java

...@Overrideprotected List
getPackages() { return Arrays.
asList( new MainReactPackage(), new JAnalyticsPackage(SHUTDOWN_TOAST, SHUTDOWN_LOG) );}

上面的两个参数是 bool 类型的,第一个参数设置为 true 表示关闭 toast 提示,第二个设置为 true 表示关闭日志打印。建议在 debug 版本中打开。

同样在 MainApplication,调用 init 方法:

@Overridepublic void onCreate() {    super.onCreate();    SoLoader.init(this, false);// 在 Init 之前调用,设置为 true,则会打印 debug 级别日志,否则只会打印 warning 级别以上的日志    JAnalyticsInterface.setDebugMode(true);    JAnalyticsInterface.init(this);}

3.2 import JAnalyticsModule

接下来在 JS 文件中只要引入 JAnalyticsModule 就可以调用它的接口了:

your component.js

...import JAnalyticsModule from 'janalytics-react-native';

调用 API

startLogPageView(params)

这个方法表示开始记录页面统计,在生命周期中调用:

componentDidMount() {    var param = {      pageName: "main"    };    JAnalyticsModule.startLogPageView(param);  }

stopLogPageView(params)

这个方法表示结束记录页面统计,在生命周期中调用:

componentWillUnmount() {    var param = {      pageName: "main"    };    JAnalyticsModule.stopLogPageView(param);  }

postEvent(event)

上报统计事件,目前事件分为:CountEvent(计数事件)、CalculateEvent(计算事件)、RegisterEvent(注册事件)、LoginEvent(登录事件)、BrowseEvent(浏览事件)、PurchaseEvent(购买事件)。各事件格式如下:

loginEvent = {     type: 'login',  // 必填     extra: Object,  // 附加键值对,格式 {String: String}     method: String,  // 填自己的登录方法     success: Boolean }registerEvent = {     type: 'register',  // 必填     extra: Object,  // 附加键值对,格式 {String: String}     method: String,  // 填自己的登录方法     success: Boolean }purchaseEvent = {    type: 'purchase', // 必填    extra: Object,  // 附加键值对,格式 {String: String}    goodsType: String,    goodsId: String,    goodsName: String,    success: Boolen,    price: float,    currency: String, // CNY, USD    count: int}browseEvent = {    type: 'browse',    id: String,    extra: Object,  // 附加键值对,格式 {String: String}    name: String,    contentType: String,    duration: float}      countEvent = {     type: 'count',     extra: Object,  // 附加键值对,格式 {String: String}     id: String}     calculateEvent = {     type: 'calculate',     extra: Object,  // 附加键值对,格式 {String: String}     id: String,     value: double}

使用示例:

onLoginPress = () => {    var LoginEvent = {      type: 'login',      extra: {        userId: "user1"      },      method: "login",      success: true    };    JAnalyticsModule.postEvent(LoginEvent);  }

转载地址:http://ezdzm.baihongyu.com/

你可能感兴趣的文章
工作三年的思考
查看>>
Java工具类 Apache Commons:commons-lang
查看>>
C++ 原来 const 中所使用的函数 必须 全都具有 const 才行
查看>>
浏览器中 for in 反射 对象成员 的差异
查看>>
关于Linux启动时挂载rootfs的几种方式
查看>>
vs2015 系统找不到指定的文件(异常来自HRESULT:0x80070002)问题的解决方法
查看>>
2018年总结
查看>>
34个漂亮的应用程序后台管理界面
查看>>
java JDK6的可变参数
查看>>
初入职场程序员的五大钻石法则
查看>>
Node.js学习笔记(一)概述
查看>>
split的3种方法
查看>>
忽略PNG透明区域的事件(AS/Flash)
查看>>
文本框只能输入正整数(大于0的整数)代码
查看>>
一步一个脚印学习WCF系列之WCF概要—WCF服务的创建与调用HelloWorld实例,通过配置文件方式(六)...
查看>>
只需简单一步,android自带的示例程序 BluetoothChat 变蓝牙串口助手
查看>>
thrift之TTransport层的内存缓存传输类TMemoryBuffer
查看>>
使用pull方式解析xml文件示例:
查看>>
学习jQuery的免费资源:电子书、视频、教程和博客
查看>>
找出数列中个数大于总数一半的元素(编程之美2.3)
查看>>