vue-ba

vue 百度统计埋点插件

Github stars Tracking Chart

vue-ba

vuejs 百度统计埋点插件

项目参考:https://github.com/raychenfj/vue-uweb

项目地址

https://github.com/minlingchao1/vue-ba

1. 安装

npm install vue-ba --save

直接在页面中引用

<script src="./node_modules/vue-uweb/dist/index.js"><script>

或者通过es6模块加载

import ba from 'vue-ba'

使用vue-ba插件

Vue.use(ba, 'YOUR_SITEID_HERE')

通过传递 options 参数进行更多设置

Vue.use(uweb,options)

options

2. ba API

2.1 trackEvent

用于发送页面上按钮等交互元素被触发时的事件统计请求。

用法

this.$ba.trackEvent(category,action,opt_label,opt_value)

参数

2.2 trackPageview

用于发送某个URL的PV统计请求,适用于统计AJAX、异步加载页面,友情链接,下载链接的流量

用法

this.$ba.trackPageview(pageURL)

参数

3. ba 指令

vue-ba 提供 track-event,track-pageview 两个指令,开发者可以直接在 html 模版中使用来统计网站数据

3.1 track-event

使用指令 v-track-event 监听事件, 通过 modifiers 指定事件类型,将自动为绑定元素添加事件监听,当事件触发调用统计代码。 如不指定事件,默认监听 click 事件。

可通过逗号分隔的字符串或对象字面量传递参数,以字符串传递时请注意参数顺序,可参考trackEvent API。

用法

<button v-track-event.click="'category, action''"></button> // 统计click事件

<button v-track-event="'category, action'"></button> // 统计click事件简写

<input v-track-event.keypress="'category, action'"> // 统计keypress事件

<button v-track-event="'category, action, opt_label, opt_value'"><button> // 以字符串传递参数

<button v-track-event="{category:'event', action:'click'}"></button> // 以对象字面量传递参数

3.2 track-pageview

使用指令 track-pageview 统计虚拟 PV ,一般可以配合 v-show 或 v-if 来统计局部动态视图的 PV。

可通过逗号分隔的字符串或对象字面量传递参数,以字符串传递时请注意参数顺序,可参考trackPageview API
用法

<div v-show="show" v-track-pageview="'/bar'">bar</div> //  跟踪 v-show 绑定元素的虚拟pv

<div v-if="show" v-track-pageview="'/foo'">foo</div> // 跟踪 v-if 绑定元素的虚拟pv

<div v-track-pageview="'/tar'"></div> // 以字符串指定受访页面和来源

<div v-track-pageview="{pageURL:'/zoo''}"></div> // 以对象字面量指定受访页面和来源

Main metrics

Overview
Name With Ownercodecraftm/vue-ba
Primary LanguageJavaScript
Program languageJavaScript (Language Count: 3)
Platform
License:
所有者活动
Created At2017-07-13 15:45:42
Pushed At2020-04-08 07:26:40
Last Commit At2020-03-14 10:42:28
Release Count0
用户参与
Stargazers Count173
Watchers Count7
Fork Count34
Commits Count15
Has Issues Enabled
Issues Count5
Issue Open Count4
Pull Requests Count5
Pull Requests Open Count1
Pull Requests Close Count1
项目设置
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private