第一步:
使用 神策 插件 npm install sa-sdk-javascript --save
第二步:
在vue项目新建文件(sensors_config.js)
// 初始化埋点功能
const sensors = require('sa-sdk-javascript');
sensors.init({
show_log: true,
server_url: '#', // 神策数据接收地址
is_track_single_page: true, // 单页面配置,默认开启,若页面中有锚点设计,需要将该配置删除,否则触发锚点会多触发 $pageview 事件
use_client_time: true,
send_type: 'beacon',
heatmap: {
//是否开启点击图,default 表示开启,自动采集 $WebClick 事件,可以设置 'not_collect' 表示关闭。
clickmap: 'not_collect',
//是否开启触达图,not_collect 表示关闭,不会自动采集 $WebStay 事件,可以设置 'default' 表示开启。
scroll_notice_map: 'not_collect'
}
});
// 注册公共属性
sensors.registerPage({
user_code: '123456789', // 工号
user_name: '张三' // 姓名
});
export default sensors;
第三步:
在mian.js进行导入注册
import sensors from './sensors_config'
Vue.prototype.$sensors = sensors;
第四步:
在神策元数据管理中
元事件中创建埋点事件(要埋点的事件,例如:点击)
事件属性中创建属性(要传递的参数或者公共属性,例如:点击的页面)
第五步:
在项目中进行点击埋点
<template>
<div>
<el-button @click="ClickBtn">点击</el-button>
</div>
</template>
<script>
export default {
methods: {
ClickBtn() {
this.$sensors.track("cs", {
// 传递的参数
source_page: '首页' // 点击的页面
});
}
}
};
</script>
<style>
</style>