Ralat projek Vue.js: Pembolehubah tidak boleh diakses sebelum permulaan

Question

Saya sedang membangunkan klon Twitter menggunakan Vue 3. Kod sumber untuk perkara yang sama boleh didapati di sini.

HomeView.vueKodnya adalah seperti berikut:

<kod><template>
  <div class="home">
    <Tweet
      v-for="tweet dalam tweet"
      :key="tweet._id"
      :tweet="tweet"
  </div>
</template>

<skrip>
import { ref } daripada 'vue';
import Tweet daripada '../components/Tweet';
import tweet daripada '../tweets';

eksport lalai {
  persediaan () {
    tweet const = ref(tweets);

    kembali {
      tweet,
      Tweet
    }
  }
}
</skrip>
</code>

Tetapi selepas melakukan operasi yang sama, saya mendapat ralat berikut dalam konsol pembangun.

Tidak ditangkap (dalam janji) ReferenceError: Tidak boleh mengakses 'tweet' sebelum permulaan

Answer 1

Bukan pakar API komposisi, tetapi saya ingin melihat kitaran hayat, anda tidak boleh menggunakan tweet seperti ini kerana ia tidak boleh digunakan secara langsung. Mereka kemudiannya akan diisi.

Semasa templat anda disegerakkan, ia akan ralat kerana ia tidak boleh mengakses sesuatu apabila ia (pada mulanya) tidak ditentukan.

Pengeluaran

可能是一个解决方案，否则可能是与 watch dan Suspens, tidak pasti.

PS: Terdapat 2 lagi tweets pembolehubah di sini, yang mungkin menyebabkan beberapa ralat, sila berhati-hati.