vue使用百度统计埋点

统计代码安装

//main.js
声明_hmt对象
var _hmt = _hmt || [];
window._hmt = _hmt; // 必须把_hmt挂载到window下，否则找不到

//统计代码获取
(function() {
      var hm = document.createElement("script");
      hm.src ="https://hm.baidu.com/hm.js?百度统计所申请的appKey";   
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(hm, s);
 })();

页面埋点

trackPageView(用于发送某个指定URL的PV统计)
语法：_hmt.push([’_trackPageview’, pageURL]);
参数：pageURL ： 指定要统计PV的页面URL（ 必须是以"/"（斜杠）开头的相对路径）
例：_hmt.push([’_trackPageview’, ‘/virtual/login’]);

//监听路由下所有页面
router.beforeEach((to, from, next) => {
  // next()
  if (_hmt) {
    if (to.path) {
        _hmt.push(['_trackPageview', '/#' + to.path]);
    }
  }

})

事件埋点

trackEvent(用于触发某个事件，如某个按钮的点击，或播放器的播放/停止，以及游戏的开始/暂停等)
语法：_hmt.push([’_trackEvent’, category, action, opt_label,opt_value]);
参数：
category： 必选 String => 要监控的目标的类型名称 => 不填、填"-“的事件会被抛弃
action： 必选 String => 用户跟网页进行交互的动作名称=> 不填、填”-“的事件会被抛弃
opt_label： 可选 String => 事件的一些额外信息 => 不填、填”-"代表此项为空
opt_value： 可选 Number => 跟事件相关的数值

例：

//template
<input placeholder="请输入搜索内容" v-model="searchValue" class="input-with-select" style="width:612px;">
<button @click="searchFn"> 搜索 <button/>
js

data(){
	return {
		searchValue:''
	}
}

methods:{
	searchFn(){
		_hmt.push(['_trackEvent', 'search', 'click',  this.searchValue]);
	}
}

埋点完成后的数据需要登录百度统计在基础报告 => 访问分析中查看百度统计

附：百度统计文档