Vue----项目增加百度统计

时间:2019-11-07
本文章向大家介绍Vue----项目增加百度统计,主要包括Vue----项目增加百度统计使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

到百度统计->注册账号->新增网址->获取代码

在Vue单页面开发中接入百度统计代码时,如果直接按照官网的走会出现错误,就是_hmt找不到,这是因为在一个js文件里声明的变量在另一个js文件里是找不到的,所以需要把_hmt挂载到window对象下,这样_hmt成为了全局变量,就可以在任何地方访问了。

1.在maim.js下百度统计代码添加

var _hmt = _hmt || [];
window._hmt = _hmt; // 必须把_hmt挂载到window下,否则找不到(很多网友说需要添加我没加也成功了)
 (function () {
       var hm = document.createElement("script")
       hm.src = "https://hm.baidu.com/hm.js?"+自己的百度站点id
       var s = document.getElementsByTagName("script")[0]
       s.parentNode.insertBefore(hm, s)
  })();

2.创建vuerouter后,调用beforeEach方法,每个路由跳转时都将其跳转的路由推给百度。

router.beforeEach((to, from, next) => {
    if (_hmt) {
        if (to.path) {
            _hmt.push(['_trackPageview', '/#' + to.fullPath]);
        }
    }
    next();
});

注意事项

设置好之后马上检查代码的话会显示未识别到代码,需要等待半小时左右去检查,正常会提示代码安装成功

统计数据会在代码安装之后的2-3小时之后显示

百度统计代码每次更新时间约5分钟,添加或修改后要等待。

原文地址:https://www.cnblogs.com/humiao-0626/p/11813380.html