1.0.4 • Published 10 months ago
jolyne_tracker v1.0.4
Features
✔️ PV 统计(页面浏览量/点击量)
✔️ UV 统计
✔️ 自定义埋点上报
✔️ 错误捕获(目前只对 JS、Promise 错误进行上报)
❌ 性能指标上报(后续迭代)
安装
方式一:推荐✨✨✨✨✨
npm i jolyne_tracker
方式二: npm run build 后生成 dist 包,直接在项目中引入 dist 包下的 index.js 即可
使用
import Tracker from "jolyne_tracker"
const tracker = new Tracker({
appId: "项目id", //必填
requestUrl: "数据上报地址", //必填
uuid: "", //可选,用户 ip 或者唯一标识,若没有传入,则上报时 uuid 为 undefined,且只会统计 pv
routerTracker: "history" || "hash", //可选,开启 pv/uv 统计,路由切换方式为 history 或者 hash,
domClickTracker: true, //可选,是否开启鼠标事件,比如click dbclick contextmenu 的打点上报
version: "1.0.0", //可选,版本号
jsError: true, //可选,开启 JS、Promise 错误上报
})
reportTracker 用于手动上报
tracker.reportTracker(data) data上传的数据,data 必传项: {trackerKey: "string"}
点击事件上报方式
① 组件库支持属性透传时自动上报
<Button tracker-key="tracker001">点击我自动上传埋点</Button>
目前已知不支持属性透传的组件库 vant
② 组件库不支持属性透传时可使用 reportTracker 手动上报
<Button onClick={selfTracker}>点击我手动上传埋点</Button>
const selfTracker = () => {
tracker.reportTracker(
{
trackerKey: "tracker002", // 必传项
event: "click"
},
)
}
若没有设置 tracker-key,需手动上报
addExternalOptions 使用时机
tracker.addExternalOptions({}) 当您的项目需要额外上传数据时,请使用它
比如点击事件埋点时:
① 若设置了 trakcer-key
<Button
tracker-key="tracker004"
onClick={() => {
tracker.addExternalOptions({
name: "lxq",
age: 23,
})
}}>
上传额外参数
</Button>
/*
此时,上传的数据为:
{
name: "lxq",
age: 23,
trackerKey: "tracker004",
event: "click"
}
*/
注意:若没有设置 tracker-key,此时直接通过 reportTracker 手动上报即可,不要调用 addExternalOptions
<Button
onClick={() => {
tracker.reportTracker({
name: "lxq",
age: 23,
trackerKey: "click_button_by_myself", // 必传项
event: "click"
})
}}>
上传额外参数
</Button>
/*
此时,上传的数据为:
{
name: "lxq",
age: 23,
trackerKey: "click_button_by_myself", // 必传项
event: "click"
}
*/