时间戳

首页 > 解决方案 > Nuxt.js 异步头元值

nuxt.js - Nuxt.js 异步头元值

问题描述

我想为我的用户创建一个独特的页面，并且我希望他们的用户名位于 URL 中，例如https://mycure.com/gaben.

我使用动态路由和head()方法实现了这一点。如果信息是静态的，一切都很好。但是，我正在对我的 API 进行 REST 调用以提供用户数据，这将是头部标题和头部描述的值。

由于请求是异步的，因此标头中标题和描述的默认值未正确呈现在 HTML 中。

因此，这就像内容呈现和获取用户数据的异步调用之间的竞争条件。

这是我目前的head方法：

head () {
  // async call for user data
  return this.initMetaHead();
}

实际流量

  1. 渲染页面 - 默认标题值
  2. 异步调用
  3. 设置新标题 - 查看页面源代码时不会反映到实际的 html

所需流量

  1. 异步调用
  2. 使用正确的标题和描述呈现页面

有没有办法做到这一点？谢谢。

标签： nuxt.js

解决方案

推荐阅读