1. hirohero

    Posted

    hirohero
Changes in title
+Vue-SPAでもGoogle Analyticsしたい!
Changes in tags
Changes in body
Source | HTML | Preview
@@ -0,0 +1,45 @@
+小ネタです。
+
+VueでSPAを作った時にも、GoogleAnalytics(以下、GA)でトラッキングしたい!
+でもどうしたら…。
+
+と思った皆さん、朗報です。 [vue-analytics](https://github.com/MatteoGabriele/vue-analytics)というモジュールがあります。
+
+# 使い方
+とっても簡単。モジュールをロードして、`Vue.use()`で組み込むだけ。
+
+```javascript:main.js
+import Vue from 'vue'
+import VueAnalytics from 'vue-analytics'
+
+Vue.use(VueAnalytics, {
+ id: 'UA-XXX-X'
+})
+```
+
+あとは
+
+```javascript
+this.$ga.page('/')
+```
+
+と呼び出すだけでGAにAPIを投げてくれます。
+
+
+## vue-routeとの連携
+[vue-router](https://router.vuejs.org/ja/) を使っている場合は、
+
+
+```javascript:main.js
+import Vue from 'vue'
+import router from './router'
+import VueAnalytics from 'vue-analytics'
+
+Vue.use(VueAnalytics, {
+ id: 'UA-XXX-X',
+ router
+})
+```
+
+とすれば、ページ(URL)切り替えをするたびに自動的にGAにAPIを投げてくれます。
+便利ですね。