Google Analytics is not available on certain pages in vue.js

Asked 2 years ago, Updated 2 years ago, 105 views

As the title suggests, I am having trouble using Google Analytics on certain pages of vue.js.

The configuration of the system is
Step1-step3->Input form screen
complete->The screen that transitions after completing the input to step 3 of the above input form
The configuration is similar to that of
using the vue router, each component (steps 1 to 3 and complete) is
You only want to use Google Analytics on the complete screen in the calling system.

I tried to embed the analytics code in components>complete.vue in the form below, but it didn't take effect.

Tried Code

I'm sorry I'm not familiar with vue and Google Analytics, but
It would be very helpful if you could let me know.
Thank you for your cooperation.

javascript vue.js google-analytics

2022-09-30 16:42

1 Answers

If you want to use a script tag, it would be better to make a DOM directly.
Add the script tag to the head tag when displaying the page (it doesn't have to be head).If I just transition to another page, the Google Analytics tag remains, so I try to delete it

I didn't actually try it with Google Analytics tags, but for your information

<script>
export default {
  data(){
    US>return{
      script: null,
    };
  },
  created(){
    // load gtag before displaying page
    this.script = document.createElement("script");
    This.script.async=true
    this.script.src = "URL for gtag"
    document.head.appendChild(this.script);
  },
  destroyed(){
    // Remove gtag before page movement
    This.script.remove();
  },
};
</script>


2022-09-30 16:42

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.