Vue.js 프로젝트 오류: 초기화 전에 변수에 액세스할 수 없습니다.

Question

저는 현재 Vue 3를 사용하여 Twitter 복제본을 개발 중입니다. 동일한 소스 코드는 여기에서 찾을 수 있습니다.

HomeView.vue코드는 다음과 같습니다.

<code><템플릿>
  <div class="집">
    <트윗
      v-for="트윗 속의 트윗"
      :key="tweet._id"
      :트윗="트윗"
  </div>
</템플릿>

<스크립트>
'vue'에서 { ref } 가져오기;
'../comComponents/Tweet'에서 트윗을 가져옵니다.
'../tweets'에서 트윗을 가져옵니다.

기본값 내보내기 {
  설정 () {
    const 트윗 = ref(트윗);

    반품 {
      트윗,
      트위터
    }
  }
}
</스크립트>

<p>그러나 동일한 작업을 수행한 후 개발자 콘솔에 다음과 같은 오류가 발생합니다. </p>
<pre class="brush:php;toolbar:false;">잡히지 않음(약속 있음) ReferenceError: 초기화 전에 '트윗'에 액세스할 수 없습니다

Answer 1

컴포지션 API 전문가는 아니지만 lifecycle을 살펴보고 싶었고, 이런 트윗은 직접 사용할 수 없기 때문에 사용할 수 없습니다. 그러면 그것들이 채워질 것입니다.

템플릿이 동기화되는 동안 (처음에) 정의되지 않은 항목에 액세스할 수 없기 때문에 오류가 발생합니다.

프로덕션

可能是一个解决方案，否则可能是与 watch과 서스펜스, 확실하지 않습니다.

PS: 여기에는 2개의 tweets 변수가 더 있으므로 오류가 발생할 수 있으므로 주의하시기 바랍니다.