Vue.js/Way Home

[suspense] Component <Anonymous>: setup function returned a promise, but no <Suspense> boundary was found in the parent component tree. A component with async setup() must be nested in a <Suspense> in order to be rendered. at <CategoryComponent onSele..

Judith Hopps 2022. 10. 18. 19:53
반응형

에러 : 

해결 방법 : 

컴포넌트를 따로 생성한 후 부모 컴포넌트에서 suspense를 사용해준다

==> 즉 자식 컴포넌트가 준비 될 때까지 부모 컴포넌트에서 대기하게 한다.

 

코드 :

 
<Suspense>
      
        <CategoryComponent @select="getData"/>   
           
</Suspense>
   

But...로드하는 과정이 자연스럽지 않아 #fallback문을 작성하는 것이 좋다.

아래 코드를 참고하길 바란다.

<Suspense>
        <!-- <template #default> -->
        <CategoryComponent @select="getData"/>
       
            <!-- 로딩 -->
            <template #fallback>
              <div>
                카테고리 :
                <select id="selectRoute"></select>
                <select id="selectRest"></select>
              </div>
            </template>
           
      </Suspense>
반응형