Hantar user_id ke Google Analitis 4 menggunakan vue-gtag dan nuxtjs

Question

Saya ada projek Nuxtjs. Saya menggunakan https://github.com/MatteoGabriele/vue-gtag. Saya cuba menghantar user_id ke Google Analitis 4 apabila id pengguna wujud tetapi kod gagal tetapi tidak berfungsi. Saya mendaftar masuk ke GA4 tetapi tiada data "Log masuk dengan ID pengguna termasuk ya":

import Vue from "vue";
import VueGtag from "vue-gtag";

export default ({ $config, $auth }) => {
  const obj = {
    config: {
      id: 'G-XXXXXXXXXX'
    }
  }
  if ($auth?.loggedIn) {
    obj.config.params = {user_id: $auth.user.sub}
  }
  Vue.use(VueGtag, obj, app.router)
}

Kod berikut sedang dijalankan:

import Vue from "vue";
import VueGtag from "vue-gtag";

export default ({ $config, $auth }) => {
  Vue.use(VueGtag, {
    config: {
      id: 'G-XXXXXXXXXX',
      params: {
        user_id: '122xzczxc'
      }
    }
  }, app.router)
}

Boleh saya bantu anda? Saya mahu menghantar user_id ke GA4 apabila user_id wujud.

Answer 1

Balas dengan betul selepas mengulas dan apa yang saya rasa saya telah faham.

Jika anda menukar syarat kepada nilai lalai, contohnya:

if ($auth?.loggedIn) {
  obj.config.params = {user_id: '123-update-id'}
}

Ini tidak berfungsi.

Tetapi jika anda memulakan objek anda seperti ini:

const obj = {
  config: {
    {
      id: 'G-XXXXXXXXXX',
      params: {
      user_id: '123-default-id'
    }
  }
}

Syarat pada

$auth?.loggedIn akan berfungsi dan memberikan nilai.

Dalam kes ini, masalahnya ialah anda perlu mempunyai struktur lalai untuk objek anda. Dalam kes ini, objek tidak mencipta sifat baharu yang boleh menyebabkan masalah async atau struktur, ia hanya mengemas kini sifat.

Buat ini sahaja:

const obj = {
  config: {
    {
      id: 'G-XXXXXXXXXX',
      params: {
      user_id: ''
    }
  }
}