Nuxt：无法在 'created' 生命周期中在服务器上设置数据 属性

Question

我尝试在服务器上的“已创建”生命周期方法中为 属性 设置一个值，但该值仍然为空（其默认值）。

（我使用 typescript 和基于 class 的组件）

export default class FunClass extends Vue {
  @Prop() data!: any;
  myProp : any = null;

   created() {
    if (process.server) {
      this.myProp = this.data.interestingData;
    }
  }
}

所以一定有什么规则我漏掉了？ 我试过 asyncData 但它只适用于页面（我无法从那里访问任何道具）。

Answer 1

如果你想在任何地方（页面、组件、布局等）处理你的数据，你可以使用 fetch() 钩子，它非常方便，因为它有像 [=11= 这样的助手] 并且它不会阻塞，因此您可以在加载数据时显示一些不错的 skeletons，例如 Instagram/Facebook.

有关更多信息，您可以在 Nuxt 中查看有关 data fetching 的文档。

如果您想对 fetch() vs asyncData 有更多不同意见，这里有一个 有很多不同的好答案。