NuxtJS 在使用 Nuxt-Link 访问路由时预取数据？

Question

我有这个设置：

index.vue -> 包含不同的<NuxtLink:to="/abc">或<NuxtLink:to="/def">

abc.vue 和 def.vue 使用 function async asyncData() {... }从 API 加载数据。

我的问题是，function asyncData仅在第一次请求路径/abc或/def时在服务器端执行。 感谢 NuxtJS 的文档，我知道这是正常行为。 但是，当使用<Nuxt-Link>时，如何从服务器上预取的 API 获取数据？

Answer 1

那么你需要做一个解决方法。 asyncData提供了一个参数context 。 所以你可以访问你的 vuex 商店：

asyncData({store}) {
   store.commit("somecommit", "somevar");
}

在您的 vuex 商店中，您有一个 state 某处，例如link1 。

随着您的提交，您可以更改 state。

现在您可以使用<NuxtLink:to="$store.state.link1">