Erreur du projet Vue.js : la variable n'est pas accessible avant l'initialisation

Question

Je développe actuellement un clone de Twitter en utilisant Vue 3. Le code source de celui-ci peut être trouvé ici.

HomeView.vueLe code est le suivant :

<code><template>
  <div class="accueil">
    <Tweet
      v-for="tweet dans les tweets"
      :key="tweet._id"
      :tweet="tweet" />
  </div>
</modèle>

<script>
importer { ref } depuis 'vue' ;
importer un Tweet depuis '../components/Tweet' ;
importer des tweets depuis '../tweets' ;

exporter par défaut {
  installation () {
    const tweets = ref(tweets);

    retour {
      des tweets,
      Tweeter
    }
  }
}
</script>
</code>

Mais après avoir effectué la même opération, j'obtiens l'erreur suivante dans la console du développeur.

Non capturé (promis) ReferenceError : Impossible d'accéder aux "tweets" avant l'initialisation

Answer 1

Je ne suis pas un expert de l'API de composition, mais je voulais jeter un œil au cycle de vie, et vous ne pouvez pas utiliser de tweets comme celui-ci car ils ne sont pas disponibles directement. Ils seront alors comblés.

Lorsque votre modèle est synchronisé, une erreur se produira car il ne pourra pas accéder à quelque chose lorsqu'il n'est (initialement) pas défini.

Production

可能是一个解决方案，否则可能是与 watch et Suspense, pas sûr.

PS : Il y a 2 autres tweets variables ici, ce qui peut provoquer des erreurs, soyez prudent.