最近产品让我加上数据统计功能,刚好极光官方支持数据统计 支持了 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. 微信小程序滚动动画,点击事件及评分星星制作!

    前言 小程序上线刷爆了朋友圈,但是最近渐渐消沉了,很少有动静!最近公司项目需要,体验了一下微信小程序,制作了几个功能,布局感觉很简单,但是交互和动画等写起来确实很费劲,主要是因为他不能操作DOM,只能 ...

  2. cisco linksys ea3500 刷机 openwrt

    家中router改造成千兆华为A1,淘汰下来的cisco linksys ea3500  终于可以去刷机 openwrt,尽情折腾啦! 分享步骤: 准备文件 https://archive.openw ...

  3. C#图解教程 第二十二章 异常

    异常 什么是异常try语句 处理异常 异常类catch 子句使用特定catch子句的示例catch子句段finally块为异常寻找处理程序更进一步搜索 一般法则搜索调用栈的示例 抛出异常不带异常对象的 ...

  4. 求字符串空格、数字、字母个数--JAVA基础

    相关内容:charAt()函数 package com.nxl123.www;public class NumString { public static void main(String[] arg ...

  5. MySQL入门笔记(二)

    MySQL的数据类型.数据库操作.针对单表的操作以及简单的记录操作可参考:MySQL入门笔记(一) 五.子查询   子查询可简单地理解为查询中的查询,即子查询外部必然还有一层查询,并且这里的查询并非仅 ...

  6. 描述下@Component,@Repository,@Service,@Scope,@Autowired,@Inject,@Value标记的作用

    1.@Component为通用注解. 2.@Repository为持久层组件注解. 3.@Service为业务层组件注解. 4.@Scope为Bean的作用域注解. 5.@Autowired,@Inj ...

  7. 【BZOJ2005】【NOI2010】能量采集(莫比乌斯反演,容斥原理)

    [BZOJ2005][NOI2010]能量采集(莫比乌斯反演,容斥原理) 题面 Description 栋栋有一块长方形的地,他在地上种了一种能量植物,这种植物可以采集太阳光的能量.在这些植物采集能量 ...

  8. [BZOJ1012] [JSOI2008] 最大数maxnumber (ST表)

    Description 现在请求你维护一个数列,要求提供以下两种操作:1. 查询操作.语法:Q L 功能:查询当前数列中末尾L个数中的最大的数,并输出这个数的值.限制:L不超过当前数列的长度.2. 插 ...

  9. 某厂java算法题实现及改进【有n个人成一圈,顺序排号(编号为1到n),从第一个人开始报数1到3报数】

    一.第一种实现: 实现比较简单,直接贴现成的代码了,第一种实现: /** * 总人数 * * @param d */ private static void sortQuerry1(int d) { ...

  10. 基于Redis的简单分布式锁的原理

    参考资料:https://redis.io/commands/setnx 加锁是为了解决多线程的资源共享问题.Java中,单机环境的锁可以用synchronized和Lock,其他语言也都应该有自己的 ...