wu_wen_cai原创
关注
4点赞·2951人阅读
第一步：
使用 神策 插件 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>
vue项目前端埋点的实现
5下载·0评论
vue 项目中神策埋点
3162阅读·1评论·3点赞
Vue项目埋点方案
138阅读·0评论·0点赞
基于Vue的数据埋点统计
1201阅读·0评论·6点赞
神策埋点测试教程（图文介绍）
43下载·0评论
vue项目中数据埋点
1472阅读·0评论·1点赞
vue前端添加埋点事件
1570阅读·0评论·1点赞
前端埋点实现方案
3271阅读·2评论·8点赞
vue项目进行数据埋点
2344阅读·0评论·0点赞
神策埋点的接入使用方法
5010阅读·2评论·2点赞
uni-App神策数据埋点引入以及使用
580阅读·0评论·0点赞
神策数据埋点实操
1662阅读·2评论·3点赞
vue自定义指令实现前端埋点+重写路由方法监听浏览时间
571阅读·0评论·1点赞
Vue前端神策数据埋点
1550阅读·0评论·1点赞
Vue项目中，webfunny前端埋点部署
646阅读·2评论·3点赞
前端vue自定义指令（directive）实现数据埋点
115阅读·0评论·0点赞
vue自定义指令实现数据埋点
313阅读·0评论·0点赞
去首页
看看更多热门内容
1.先引入sensor.js文件
2.全局引入使用sensor
3.点击按钮进行埋点
4.在进入页面的时候会自动触发一个'pageView'事件，点击按钮会触发'webClick'事件
参考文档
对应路由地址为
那么，Nuxt.js 自动生成的路由配置如下：
以下目录结构：
Nuxt.js 生成对应的路由配置表为：
你会发现名称为 users-id 的路由路径带有 :id? 参数，表示该路由是可选的。如果你想将它设置为必选的路由，需要在 users/_id 目录内创建一个 index.vue 文件。
举个例子： pages/users/_id.vue
如果校验方法返回的值不为 true或Promise中 resolve 解析为false或抛出 Error ， Nuxt.js 将自动加载显示 404 错误页面或 500 错误页面
类似于vue路由导航功能
提示: 别忘了在布局文件中添加 <nuxt/>组件用于显示页面的主体内容。
默认布局的源码如下：
假设我们要创建一个 博客布局 并将其保存到layouts/blog.vue:
然后我们必须告诉页面 (即pages/posts.vue) 使用您的自定义布局：
可以用于弹窗/加载态....
注入
使用
诸如一些登录,退出或者一些api请求方法可以使用此方法注入,更加简洁优雅,或者嵌套组件使用方便数据传递
此配置需要在nuxt.config.js 配置
store/index.js
神策分析，是针对企业级客户推出的深度用户行为分析产品，支持私有化部署，客户端、服务器、业务数据、第三方数据的全端采集和建模，驱动营销渠道效果评估、用户精细化运营改进、产品功能及用户体验优化、老板看板辅助管理决策、产品个性化推荐改造、用户标签体系构建等应用场景。作为 PaaS 平台支持二次开发，可通过 BI、大数据平台、CRM、ERP 等内部 IT 系统，构建用户数据体系，让用户行为数据发挥深远的价值。
简而言之,就是对用户行为进行数据分析
用于cookie 的设置
css框架
判断当前环境是否为移动端
+静态应用部署
