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

在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分钟,添加或修改后要等待。

Vue----项目增加百度统计的更多相关文章

  1. uniapp增加百度统计代码(h5)

    做了个微信公众号文章互相阅读的h5界面,http://mptask.wintp.top/(只能微信浏览器打开),其中用到了统计代码,记录如下. 1.新建 tj.html 界面 可放置在项目的根目录,文 ...

  2. vue中引入百度统计

    vue作为单页面的,引入百度统计,需要注意不少. 一.基本的流量统计 在index.html 入口文件中引入百度统计生成的一连串代码: var _hmt = _hmt || []; (function ...

  3. 怎样为你的CSDN博客增加百度统计

    曾经CSDN使用的 量子统计 能够非常好的统计我们的博客的訪问数量.地域等等信息,可是不知道后来为什么不在使用了.那么怎样找到 一种替换的方式那? 下边,就给大家介绍一下怎样使用百度统计. 百度统计账 ...

  4. vue项目 调用百度地图 BMap is not defined

    这次老板新接了一个四点半官网页面,使用vue来写.emm……我感觉整个人都不好了,两天半解决了20个静态页面.还好vue写页面简直飞快,遇到一个vue的新坑,使用百度地图. 研究了好一会,总是报错BM ...

  5. Vue项目引入百度地图

    先去百度开放平台申请ak.http://lbsyun.baidu.com/ 进来之后 按照步骤走,先登录百度账号,然后申请成为开发者,然后申请ak密钥 填写完毕后提交,会给你邮箱发个激活邮件 点击申请 ...

  6. vue项目使用百度地图API获取经纬度

    一.首先在百度api注册获得ak密钥 二.进行引入 (1).第一种方式: 直接在vue中index.html中用script标签引入. //你的ak密钥需要替换真实的你的ak码 <script ...

  7. vue项目,百度地图api高亮选取区域,高亮某个地区,行政区域等

    效果如下: var blist = [] ,maxZoom: });// 创建地图实例 var point = new window.BMap.Point(89.48,31.57); map.cent ...

  8. vue项目接入百度地图

    方法一 :使用第三方工具 vue-baidu-map 安装命令: yarn add vue-baidu-map --save 文档地址:https://dafrok.github.io/vue-bai ...

  9. vue项目中使用百度统计

    统计有多少人访问了自己的网站(wap端pc web端都适用),或者更细的统计网站每个页面的访问量,可以使用百度统计 百度统计传送门 按提示注册登录即可 登录后-->管理-->新增网站,配置 ...

随机推荐

  1. 阶段1 语言基础+高级_1-3-Java语言高级_04-集合_05 List集合_1_List集合_介绍&常用方法

    有序的,还包含索引,允许有重复的值 . add   打印出来的不是地址,说明重写了toString的方法 remove方法 返回的是被移除的元素 set方法 get 索引越界异常 几种越界的异常

  2. Java面试中hashCode()与equals(Object obj)方法关系的准确回答

    原文地址: https://blog.csdn.net/qq_19260029/article/details/77917925 hashCode()与equals(Object obj)都是Java ...

  3. python 操作openpyxl导出Excel 设置单元格格式以及合并处理

    贴上一个例子,里面设计很多用法,根据将相同日期的某些行合并处理. from openpyxl import Workbook from openpyxl.styles import Font, Fil ...

  4. 关于staticmethod() 函数

    说实话,我就不知这个是干什么的. 菜鸟教程写的无需实例化, 自己可以调用自己. 在同一个类面我使用到了 因为一个类了, 我可能会方法间互相调用. 类中间使用.不加这个,就会报错.无法识别这个 orig ...

  5. 【ABAP系列】SAP MB5B中FI凭证摘要是激活的/结果可能不正确 的错误

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP MB5B中FI凭证摘要是 ...

  6. python每日一练:0004题

    第 0004 题: 任一个英文的纯文本文件,统计其中的单词出现的个数. import re count = 0 with open('./EnglishText.txt','r') as f: tem ...

  7. Linux apt-get命令的基本使用

    学习笔记,如有侵权,立即删除! 什么是apt-get ? Ubuntu源自Debian Linux.Debian使用dpkg打包系统.包装系统是一种为安装提供程序和应用程序的方法.这样,您就不必从源代 ...

  8. OuterXml和InnerXml

    例如 <bkk> <rp fe="few" > <fe>fff</fe> </rp> </bkk> 对于fe ...

  9. CentOS7 修复grub.cfg文件

    为了达到实验目的,首先删除grub.cfg文件 重启后发现系统进不去了,这正是我们想要的 进入系统救援模式,通过输入以下命令修复grub.cfg文件 重启后发现能正常引导进入系统了

  10. github廖雪峰git

    gitHub地址: https://github.com/DickyQie/Tool-use/tree/git-learning-document