React Native 轻松集成统计功能(iOS 篇)
最近产品让我加上数据统计功能,刚好极光官方支持数据统计 支持了 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 篇)的更多相关文章
- React Native 轻松集成统计功能(Android 篇)
关于推送的集成请参考这篇文章,本篇文章将引导你集成统计功能,只需要简单的三个步骤就可以集成统计功能. 第一步 安装 在你的项目路径下执行命令: npm install janalytics-react ...
- React Native 轻松集成分享功能(iOS 篇)
产品一直催我在 RN 项目中添加分享功能,一直没找到合适的库,今天让我看到了一个插件分享给大家. 在集成插件之前,需要在各大开放平台上成功注册应用,并通过审核(支持 3 个可选的主流平台).支持的平台 ...
- React Native 轻松集成分享功能(Android 篇)
关于推送的集成请参考这篇文章,关于统计的集成请参考这篇文章,本篇文章将引导你集成分享功能. 在集成插件之前,需要在各大开放平台上成功注册应用,并通过审核(支持 3 个可选的主流平台).支持的平台如下: ...
- 教你轻松在React Native中集成统计(umeng)的功能(最新版)
关于在react-native中快速集成umeng统计,网上的文章或者教程基本来自----贾鹏辉老师的文章http://www.devio.org/2017/09/03/React-Native-In ...
- React Native 手工搭建环境 之iOS篇
常识 React native 开发服务器 在开发时,我们的框架是这样的:  当正式发布进入到生产环境时,开发服务器上所有的js文件将会被编译成包的形式,直接嵌入到客户端内.这时,已经不再需要开发服 ...
- React Native之通知栏消息提示(ios)
React Native之通知栏消息提示(ios) 一,需求分析与概述 详情请查看:React Native之通知栏消息提示(android) 二,极光推送注册与集成 2.1,注册 详情请查看:Rea ...
- React Native之配置URL Scheme(iOS Android)
React Native之配置URL Scheme(iOS Android) 一,需求分析 1.1,需要在网站中打开/唤起app,或其他app中打开app,则需要设置URL Scheme.比如微信的是 ...
- React Native项目集成iOS原生模块
今天学习一下怎么在React Native项目中集成iOS原生模块,道理和在iOS原生项目中集成React Native模块类似.他们的界面跳转靠的都是iOS原生的UINavigationContro ...
- react native 之 在现有的iOS工程中集成react native
在现有的iOS工程中集成react native, 或者说将react native引入到iOS 项目,是RN和iOS混合开发的必经之路 参考官网教程:https://reactnative.cn/d ...
随机推荐
- Asp.Net Core轻松入门之WebHost的配置
在本篇文章中,我来讲一讲如何利用WebHost来加载配置文件和设置启动的Url 在前面的文章中讲过,ASP.Net Core应用程序会自动加载appsettings.json中的配置文件,那么如果配置 ...
- C#图解教程 第十三章 委托
委托 什么是委托委托概述声明委托类型创建委托对象给委托赋值组合委托为委托添加方法从委托移除方法调用委托委托示例调用带返回值的委托调用带引用参数的委托匿名方法 使用匿名方法匿名方法的语法 Lambda ...
- 公网访问阿里云数据库MongoDB——填坑日记
业务情景 两台服务器,一台阿里云ECS云服务器(专用网络),另一台是阿里云数据库MongoDB,处于安全考虑MongoDB是不运行外网连接的,那接下来就看怎么实现公网访问. 看到上面红色的网络类型描述 ...
- jtyhon 介绍
Jython是Python的纯Java实现.她无缝地结合了Java类与Python,使用户能以Python语言的语法编写在Java虚拟机上运行的 软件.它的特点有:与相似的Java程序相比,Jytho ...
- 【BZOJ3529】数表(莫比乌斯反演,树状数组)
[BZOJ3529]数表(莫比乌斯反演,树状数组) 题解 首先不管\(A\)的范围的限制 要求的东西是 \[\sum_{i=1}^n\sum_{j=1}^m\sigma(gcd(i,j))\] 其中\ ...
- 【WC2001】【cogs358】高性能计算机(动态规划)
[WC2001][cogs358]高性能计算机(动态规划) ##题面 [问题描述] 现在有一项时间紧迫的工程计算任务要交给你--国家高性能并行计算机的主管工程师--来完成.为了尽可能充分发挥并行计算机 ...
- C++堆栈详解
一.预备知识-程序的内存分配 一个由c/C++编译的程序占用的内存分为以下几个部分 1.栈区(stack)- 由编译器自动分配释放 ,存放函数的参数值,局部变量的值等.其操作方式类似于数据结构中的栈. ...
- java 多态 ---父类调用子类方法
package test1;//多态的体现import javax.print.attribute.standard.RequestingUserName;import java.util.Scann ...
- 微信小程序腾讯云php后台解决方案
微信小程序腾讯云php后台解决方案 微信小程序前段需要添加必要的文件以配合后端 (1)wafer2-client-sdk sdk提供了几种接口包括登陆,获取用户openid,图片上传等 (2)conf ...
- 图像实验室 website 项目日志
day 1 1.问题: 在演示界面选择浏览本地图片,上传以后不显示上传图片 原因:PIL库没有装好,参见之前博客重装 2.问题: 可以上传图片并在网站上显示,但是不能得到运行结果的图片. 原因:没有将 ...