1

我在 Nuxt.js 项目中使用堆分析。在页面之间路由时,Heap 显示的是一页的标题,而不是当前页的标题。我相信这是 nuxt 路由器的问题,因为如果我将<nuxt-link>'s 更改为常规<a>标签,Heap 会显示正确的(当前页面)标题。

我已经heap.load()设置为在已安装的钩子中触发的 mixin 的一部分。我也尝试在创建的钩子中运行它。它们都将预期的数据发送到堆,但<title>.

Nuxt 配置:

head: {
  script: [{ src: '/js/tracking/heap.js' }, ...]
},

plugins: [ '~/plugins/globals.js', ... ]

插件:

import AnalyticsTracking from '~/mixins/analyticsTracking.js'
Vue.mixin(AnalyticsTracking)

混音:

methods: {
    pageEvent() {
      if (process.client) {
       // avoid the dreaded 'heap.load() is not a function' error that results 
       // when heap is loaded multiple times.
       if (this.$store.state.scriptInit.heapLoaded) return
        
       heap.load(process.env.HEAP_KEY)
       this.$store.dispatch('scriptInit/setHeapLoaded')
      }
     }
 },

页:

mounted() {
  this.pageEvent()
},
head() {
    return {
      title: this.currentPage.fields.seoTitle,
    }
}

我已经阅读了 Nuxt 路由器文档,没有看到任何对我有帮助的明显内容。我试图异步并推迟加载/js/tracking/heap.js,但这也不能解决问题。到目前为止,我发现的唯一解决方案是不使用 Nuxt 路由器,而且我不想获得它附带的预加载/预取好处。

我将不胜感激任何帮助我解决此问题的建议。谢谢。

4

0 回答 0