vue單頁應(yīng)用加百度統(tǒng)計代碼（親測有效）
更新時間：2018年01月31日 16:38:58 作者：蓓蕾心晴
這篇文章主要介紹了vue單頁應(yīng)用加百度統(tǒng)計代碼的解決方法，需要的朋友參考下吧
申請百度統(tǒng)計后，會得到一段JS代碼，需要插入到每個網(wǎng)頁中去，在Vue.js項目首先想到的可能就是，把統(tǒng)計代碼插入到index.html入口文件中，這樣就全局插入，每個頁面就都有了;這樣做就涉及到一個問題，Vue.js項目是單頁應(yīng)用，每次用戶瀏覽網(wǎng)站時，訪問內(nèi)頁時頁面是不會刷新的，也就意味著不會觸發(fā)百度統(tǒng)計代碼；所以最終在百度統(tǒng)計后臺看到的效果就是只統(tǒng)計到了網(wǎng)頁入口的流量，卻無法統(tǒng)計到內(nèi)頁的訪問流量。
解決方法
在main.js文件中調(diào)用vue-router的afterEach方法,將統(tǒng)計代碼加入到這個方法里面，這樣每次router發(fā)生改變的時候都會執(zhí)行一下統(tǒng)計代碼，這樣就達到了目的,代碼如下:
router.afterEach( ( to, from, next ) => {
setTimeout(()=>{
var _hmt = _hmt || [];
(function() {
//每次執(zhí)行前，先移除上次插入的代碼
document.getElementById('baidu_tj') && document.getElementById('baidu_tj').remove();
var hm = document.createElement("script");
hm.src = "https://#/hm.js?xxxx";
hm.id = "baidu_tj"
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
},0);
} );
總結(jié)
以上所述是小編給大家介紹的vue單頁應(yīng)用加百度統(tǒng)計代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
cross-env 是一個非常實用的 Node.js 包,它允許你跨平臺（Windows, macOS, Linux）使用環(huán)境變量,這對于在不同的操作系統(tǒng)上運行腳本時保持一致性非常有用,這篇文章主要介紹了vue cross-env使用和配置方法,需要的朋友可以參考下2024-08-08
在vue和element-ui的table中實現(xiàn)分頁復(fù)選功能
這篇文章主要介紹了在vue和element-ui的table中實現(xiàn)分頁復(fù)選功能，本文代碼結(jié)合圖文的形式給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2019-12-12
本篇文章主要介紹了如何理解Vue的作用域插槽的實現(xiàn)原理，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
這篇文章主要介紹了Vue如何實現(xiàn)table表格置頂，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要為大家詳細介紹了vue3.0實現(xiàn)復(fù)選框組件的封裝代碼，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
在 Vue 3 中,訪問子組件的 DOM 元素是一個常見的需求,本文將介紹如何在 Vue 3 中使用不同的方法來獲取子組件的 DOM 元素,需要的朋友可以參考下2023-08-08
基于vue-element組件實現(xiàn)音樂播放器功能
這篇文章主要介紹了基于vue-element組件實現(xiàn)音樂播放器功能，代碼簡單易懂，非常不錯，具有一定的參考借鑒價值，需要的朋友參考下吧2018-05-05
這篇文章主要介紹了Vue2.0在IE11版本瀏覽器中的兼容性問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
這篇文章主要為大家詳細介紹了Vue實現(xiàn)拖拽式分割布局，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要為大家詳細介紹了vue實現(xiàn)頂部左右滑動導(dǎo)航，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06