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

在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. Linux内核调试方法总结之死锁问题分析

    死锁问题分析 死锁就是多个进程(线程)因为等待别的进程已占有的自己所需要的资源而陷入阻塞的一种状态,死锁状态一旦形成,进程本身是解决不了的,需要外在的推动,才能解决,最重要的是死锁不仅仅影响进程业务, ...

  2. vue +ts 的一次踩坑日记

    在vue的方法里面写事件的时候比如写一个路由跳转,方法大概如下:  goBack1() {            console.log(this);            this.$router. ...

  3. JavaScript 基础类型,数据类型

    1.基础类型:undefined,null,Boolean,Number,String,Symbol Undefined类型:一个没有被赋值的变量会有个默认值undefined; Null类型:nul ...

  4. 16/7/8_PHP-字符串介绍

    不知道为什么慕课网还这个都要介绍.不过还是一个新的知识点. PHP开发中,我们遇到最多的可能就是字符串. 字符串变量用于包含字符串的值. 一个字符串 通过下面的3种方法来定义: 1.单引号2.双引号3 ...

  5. Centos 下更改MySQL源数据存放目录(datadir)

    MySQL在安装完成之后,其源数据默认存放在 /var/lib/mysql/ 目录下,一般情况下,该目录在根目录下,由于Linux系统默认  根目录所在挂载的磁盘容量有限,随着生产数据的不断产生,该目 ...

  6. linux--初识别

    镜像网站 下载系统镜像 http://mirrors.163.com/ http://mirrors.sohu.com https://www.netcraft.com/ 命令大全 https://m ...

  7. Java-多线程第四篇线程池

    1.什么是线程池. 线程池在系统启动的时候即创建大量的空闲的线程,程序将一个Runnable对象或者Callable对象传给线程池,线程池就会启动一个线程来执行它们的run()或者call()方法,当 ...

  8. Codeforces Round #503 (by SIS, Div. 2) C. Elections (暴力+贪心)

    [题目描述] Elections are coming. You know the number of voters and the number of parties — n and m respe ...

  9. 固定标签(position: fixed)

    document.body.scrollTop 要改成 document.documentElement.scrollTop不然不生效 <!DOCTYPE html> <html l ...

  10. java httpclient basic授权

    import org.apache.http.HttpEntity; import org.apache.http.HttpResponse; import org.apache.http.HttpS ...