Vue.js-Projektfehler: Auf die Variable kann vor der Initialisierung nicht zugegriffen werden

Question

Ich entwickle derzeit einen Twitter-Klon mit Vue 3. Den Quellcode dafür finden Sie hier.

HomeView.vueDer Code lautet wie folgt:

<code><template>
  <div class="home">
    <Tweet
      v-for="in Tweets twittern"
      :key="tweet._id"
      :tweet="tweet"
  </div>
</template>

<script>
import { ref } aus 'vue';
Tweet aus „../components/Tweet“ importieren;
Tweets aus „../tweets“ importieren;

Standard exportieren {
  aufstellen () {
    const tweets = ref(tweets);

    zurückkehren {
      Tweets,
      Twittern
    }
  }
}
</script>
</code>

Aber nachdem ich den gleichen Vorgang ausgeführt habe, wird in der Entwicklerkonsole die folgende Fehlermeldung angezeigt.

Uncaught (in Versprechen) ReferenceError: Vor der Initialisierung kann nicht auf „Tweets“ zugegriffen werden

Answer 1

不是组合 API 专家，但我想看看生命周期，你不能像这样直接使用推文，因为它们不能直接使用。之后它们就会被填充。

虽然您的模板是同步的，但它会出错，因为当它（最初）未定义时它无法访问某些内容。

制作

可能是一个解决方案，否则可能是与 watch 和 悬念，不确定。

PS：这里还有 2 个 tweets 变量，这可能会导致一些错误，请小心。