0

在我正在处理的项目中，我在 pages/news/_slug.vue 中有一个动态页面

我使用 asyncData 挂钩来获取页面上使用的数据并设置 slug 以便语言切换器工作。i18n 是通过 nuxt/i18n 包 btw 完成的。

当我使用语言切换器时，浏览器中的 url 会更新，但 asyncData 中的 console.log 显示 params.slug 不会从浏览器更新为新的 slug。

async asyncData ({ store, params, $fetchContent }) {
  const type = "news"
  console.log('slug', params.slug)
  const news = await $fetchContent(params.slug, type)
  await store.dispatch('i18n/setRouteParams', {
    en: { slug: news.slugs.en },
    fr: { slug: news.slugs.fr },
    nl: { slug: news.slugs.nl },
  })
  return { news }
},

我读到 asyncData 仅在第一页加载时运行，并且不应再次运行，因为 nuxt 加载了相同的组件。但是当我切换语言时，我在控制台中得到了 slug console.log 3 次。它只是不会更新到新的蛞蝓。因此 fetchContent 函数不起作用。

当我用新的 slug 重新加载页面时，它工作正常。有什么想法可以让我完成这项工作吗？

4

0 回答 0