Vue.jsでvue-routerを使ってルーティングする時にGoogle AnalyticsでPage Viewを取る

ググってもパッとでてこなかったので。

前提条件

• index.htmlなどにGoogle Analyticsを初期化するコードが埋め込まれていて、グローバルにga関数にアクセスできる
• vue-routerを使っている

コード

main.jsとする。VueRouterのafterEachにコールバックをセットしてga関数を呼び出せばよい。

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const router = new VueRouter({/*省略*/})

// これ
router.afterEach(function (to, from) {
  ga('send', 'pageview', to.path)
})

// 省略

おわりに

vue-reportingというのもあるらしい。