最近产品让我加上数据统计功能,刚好极光官方支持数据统计 支持了 React Native 版本

第一步 安装:

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

npm install janalytics-react-native --save
npm install jcore-react-native --save
react-native link

第二步 配置:

ReactNative iOS 端配置步骤在插件中自动完成,无需额外的配置。

第三步 使用

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

import JAnalyticsModule from 'janalytics-react-native';
JAnalyticsModule.setup({appKey: "you appKey get from jiguang website"}) // iOS 端需要先调用该方法

调用 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);
}

作者:HuminiOS - 极光推送

原文:React Native 轻松集成统计功能(iOS 篇)

知乎专栏:极光日报

React Native 轻松集成统计功能(iOS 篇)的更多相关文章

  1. React Native 轻松集成统计功能(Android 篇)

    关于推送的集成请参考这篇文章,本篇文章将引导你集成统计功能,只需要简单的三个步骤就可以集成统计功能. 第一步 安装 在你的项目路径下执行命令: npm install janalytics-react ...

  2. React Native 轻松集成分享功能(iOS 篇)

    产品一直催我在 RN 项目中添加分享功能,一直没找到合适的库,今天让我看到了一个插件分享给大家. 在集成插件之前,需要在各大开放平台上成功注册应用,并通过审核(支持 3 个可选的主流平台).支持的平台 ...

  3. React Native 轻松集成分享功能(Android 篇)

    关于推送的集成请参考这篇文章,关于统计的集成请参考这篇文章,本篇文章将引导你集成分享功能. 在集成插件之前,需要在各大开放平台上成功注册应用,并通过审核(支持 3 个可选的主流平台).支持的平台如下: ...

  4. 教你轻松在React Native中集成统计(umeng)的功能(最新版)

    关于在react-native中快速集成umeng统计,网上的文章或者教程基本来自----贾鹏辉老师的文章http://www.devio.org/2017/09/03/React-Native-In ...

  5. React Native 手工搭建环境 之iOS篇

    常识 React native 开发服务器 在开发时,我们的框架是这样的:  当正式发布进入到生产环境时,开发服务器上所有的js文件将会被编译成包的形式,直接嵌入到客户端内.这时,已经不再需要开发服 ...

  6. React Native之通知栏消息提示(ios)

    React Native之通知栏消息提示(ios) 一,需求分析与概述 详情请查看:React Native之通知栏消息提示(android) 二,极光推送注册与集成 2.1,注册 详情请查看:Rea ...

  7. React Native之配置URL Scheme(iOS Android)

    React Native之配置URL Scheme(iOS Android) 一,需求分析 1.1,需要在网站中打开/唤起app,或其他app中打开app,则需要设置URL Scheme.比如微信的是 ...

  8. React Native项目集成iOS原生模块

    今天学习一下怎么在React Native项目中集成iOS原生模块,道理和在iOS原生项目中集成React Native模块类似.他们的界面跳转靠的都是iOS原生的UINavigationContro ...

  9. react native 之 在现有的iOS工程中集成react native

    在现有的iOS工程中集成react native, 或者说将react native引入到iOS 项目,是RN和iOS混合开发的必经之路 参考官网教程:https://reactnative.cn/d ...

随机推荐

  1. jquery初始化的三种方式

    第一种 $(document).ready(function(){ alert("第一种方法."); }); 第二种 $(function(){ alert("第二种方法 ...

  2. Linux 的特殊变量(2)

    1.echo $?  输出结果为0 表示命令执行成功 场景:判断上一个命令是否成功 扩展 0:成功 2 :权限拒绝 1~125:表示运行失败 126:找到命令,但是无法执行 127:未找到要运行的命令 ...

  3. 元素(WebElement)-----Selenium快速入门(三)

    上一篇<元素定位-----Selenium快速入门(二)>说了,如何定位元素,本篇说说找到的元素(WebElement)该怎么用. WebElement常用方法:  返回值  方法名  说 ...

  4. springmvc后台取值中文乱码问题

    字符-->字节.字节-->字符时需要用到编码(Encoder).解码(Decoder) 几种编码: ASCII:总共128 ISO-8859-1:涵盖大部分西欧语言字符.一个字符一个字节表 ...

  5. WEB前端中rem单位的应用(一)

    在最近的开发和之前的的使用中,我们一般面对需要适应多端的项目或者需要移动端多设备的适应,都可能会引入rem,em这样的单位. 如果你要着手一个以上类似的项目,我们也同样建议使用rem或者干脆引入框架, ...

  6. 【xsy2115】Delight for a Cat

    Time Limit: 1000 ms Memory Limit: 512 MB Description ​ 从前,有一只懒猫叫CJB.每个小时,这只猫要么在睡觉,要么在吃东西,但不能一边睡觉一边吃东 ...

  7. IDEA jsp模板

    > File > Settings- > File and Code Templates > Other >Jsp files >Jsp File.jsp < ...

  8. LAMP基础

    前言:上一篇博文,说到了URL.http的协议.事务以及私有https的实现.此次 一. 概念: LAMP: a:apache m:mariadb,mysql p:php,perl,python 二. ...

  9. k60模块

    lptmr_time_start_ms(); //开始计时 DELAY_MS(); //延时一段时间(由于语句执行需要时间,因而实际的延时时间会更长一些) timevar = lptmr_time_g ...

  10. MySQL多数据源笔记5-ShardingJDBC实战

    Sharding-JDBC集分库分表.读写分离.分布式主键.柔性事务和数据治理与一身,提供一站式的解决分布式关系型数据库的解决方案. 从2.x版本开始,Sharding-JDBC正式将包名.Maven ...