

表題の通りですがvue.jsの特定のページでGoogleAnalyticsが使用できず困っています。

システムの構成としては  
step1～step3 -> 入力フォーム画面  
complete -> 上記入力フォームのstep3まで入力完了後遷移する画面  
の様な構成となっておりvue routerを使用して各component（step1～step3及びcomplete）を  
呼び出すシステムでしてこの中のcomplete画面でのみGoogle Analyticsを使用したいという内容となります。

試してみた事としましては、components>complete.vue内に以下の形でアナリティクスコードを埋め込みましたが反映されませんでした。

[![試したコード](https://i.stack.imgur.com/1HWL9.png)](https://i.stack.imgur.com/1HWL9.png)

vue及びGoogleAnalyticsに疎く恐れ入りますが  
ご教示頂けますと大変助かります。  
何卒よろしくお願い致します。


CC BY-SA 4.0
2021-03-24T07:51:03.970
74858
2021-03-25T11:50:45.127
35472
question
javascript vue.js google-analytics
vue.jsの特定のページでGoogleAnalyticsが使用できない


scriptタグを使いたい場合は直接DOMを作ると良さそうです。  
ページ表示時にheadタグにscriptタグを追加します(headでなくても良いです）。そのまま他のページに遷移するとGoogle
Analyticsのタグが残ったままなので削除するようにしています

実際にGoogle Analyticsのタグで試したわけではないですが、参考までに

[code]

    <script>
    export default {
      data() {
        return {
          script: null,
        };
      },
      created() {
        // ページ表示前にgtagを読み込む
        this.script = document.createElement("script");
        this.script.async = true
        this.script.src = "gtagのURL"
        document.head.appendChild(this.script);
      },
      destroyed() {
        // ページ移動前にgtagを削除
        this.script.remove();
      },
    };
    </script>
    
[/code]


CC BY-SA 4.0
2021-03-25T11:50:45.127
74894
2021-03-25T11:50:45.127
298
74858
answer