vue单页应用中根据不同城市不同业务添加百度统计代码
问题描述:
我们知道一般的百度统计代码是添加在html的head里的;但是,因为目前项目是用vue开发的单页应用,所以在路由跳转之间不会刷新页面,
统计代码如果放在项目里的index.heml的head里,我们就只能统计到整个项目的入口流量,其它内页无法实现统计。而且目前项目需要根据
不同的业务和城市添加对应的统计代码;那么只能采取下面的方法:
实现方式:
1、封装一个全局变量文件,每个城市下面对应所有业务,每个业务对应一个方法里面放统计代码。
![]()
2、在项目入口文件里的methods内封装一个方法,方法内部根据当前页面的业务与城市,遍历全局变量里找出对应的统计代码;然后执行;
![]()
3、页面首次加载时调用该方法添加对应的统计代码:
![]()
4、当我们切换城市或者跳转路由时,url肯定会发生变化,所以我们需要监测url发成变化,再调用statisticsCode() 方法;我们就完成了城市或者业务变化添加对应的统计代码。
vue单页应用中根据不同城市不同业务添加百度统计代码的更多相关文章
- 如何在vue单页应用中使用百度地图
作为一名开发人员,每次接到开发任务,我们首先应该先分析需求,然后再思考技术方案和解决方案.三思而后行,这是一个好的习惯. 需求:本项目是采用vue组件化开发的单页应用项目,现需要在项目中引入百度的地图 ...
- vue 单页应用中微信支付的坑
vue 单页应用中微信支付的坑 标签(空格分隔): 微信 支付 坑 vue 场景 在微信H5页面(使用 vue-router2 控制路由的 vue2 单页应用项目)中使用微信 jssdk 进行微信支付 ...
- Wordpress网站中添加百度统计代码
百度统计是流量分析平台,帮助收集网站访问数据,提供流量趋势.来源分析.转化跟踪.页面热力图.访问流等多种统计分析服务,同时与百度搜索.百度推广.云服务无缝结合,为网站的精细化运营决策提供数据支持,进而 ...
- vue单页应用中 返回列表记住上次滚动位置、keep-alive缓存之后更新列表数据 那点事
实践场景需求 产品列表中,滚动到一定位置的时候,点击查看产品信息,后退之后,需要回到原先的滚动位置,这是常见的需求 所有页面均在router-view中,暂时使用了keep-alive来缓存所有页面, ...
- vue单页应用中,使用setInterval()定时向服务器获取数据,后来跳转页面后,发现还在不停的获取数据。
使用VUE开发单页项目时遇到这样的问题,mounted中使用setInterval()定时向服务器获取数据,后来跳转页面后,发现还在不停的获取数据.我以为是因为我路由用的push导致的,改成repla ...
- vue单页应用前进刷新后退不刷新方案探讨
引言 前端webapp应用为了追求类似于native模式的细致体验,总是在不断的在向native的体验靠拢:比如本文即将要说到的功能,native由于是多页应用,新页面可以启用一个的新的webview ...
- vue单页应用添加百度统计
前言 申请百度统计后,会得到一段JS代码,需要插入到每个网页中去,在Vue.js项目首先想到的可能就是,把统计代码插入到index.html入口文件中,这样就全局插入,每个页面就都有了;这样做就涉及到 ...
- 解决vue单页路由跳转后scrollTop的问题
作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...
- 【前端vue开发】vue单页应用添加百度统计
前言 申请百度统计后,会得到一段JS代码,需要插入到每个网页中去,在Vue.js项目首先想到的可能就是,把统计代码插入到index.html入口文件中,这样就全局插入,每个页面就都有了;这样做就涉及到 ...
随机推荐
- Mysql和Orcale的区别
有很多应用项目, 刚起步的时候用MYSQL数据库基本上能实现各种功能需求,随着应用用户的增多,数据量的增加,MYSQL渐渐地出现不堪重负的情况:连接很慢甚至宕机,于是就有把数据从MYSQL迁到ORAC ...
- MQTT协议 Websocket JS客户端
特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...
- 用公共key实现无密码ssh
1.在主服务器master下生成密钥 $ ssh-keygen -t dsa -P '' -f ~/.ssh/id_dsa 2.将密钥放在 ~/.ssh/authorized_keys $ cat ~ ...
- laravel 使用不同账号发送邮件的问题
业务背景: 公司自己做的oa系统,不同的模块需要用不同的邮箱发送信息给收件人.比如:员工离职的时候用离职的邮箱发送离职邮件通知,员工入职的时候用入职的邮箱发送入职邮件通知.发邮件是一件耗时的任务,如果 ...
- spark streaming 3: Receiver 到 submitJobSet
对于spark streaming来说,receiver是数据的源头.spark streaming的框架上,将receiver替换spark-core的以磁盘为数据源的做法,但是数据源(如监听某个 ...
- oracle性能诊断排查
https://blog.csdn.net/qq_30553235/article/details/78809872 查看oracle用户权限: 1.查看不同用户的连接数 select usernam ...
- Java-线程等待、唤醒与中断
一.sleep() 与 wait() 两者都会让当前线程进入等待状态.唤醒后都需要等待 CPU 资源,不一定会立即执行.若在等待期间被调用此线程的的 interrupt() 方法,将会产生 Inter ...
- char类型可不可以存储一个汉字
java采用unicode,2个字节(16位)来表示一个字符, 无论是汉字还是数字字母,或其他语言.char 在java中是2个字节.所以可以存储中文 Java八种基本数据类型1)四种整数类型(byt ...
- 三种CSS样式
内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种. 内联式css样式表就是把css代码直接 ...
- CondenseNet: An Efficient DenseNet using Learned Group Convolutions
1. 摘要 作者提出了一个前所未有高效的新奇网络结构,称之为 CondenseNet,该结构结合了密集连接性和可学习的分组卷积模块. 密集连接性有利于网络中的特征复用,而可学习的分组卷积模块则可以移除 ...