렌더링 기능을 사용하여 사용자 정의 구성 요소의 모든 항목을 래핑하는 Vue 3 트릭

Question

나만의 정렬 가능한 구성 요소를 만들려고 합니다. 기본 슬롯에 항목 목록을 전달하고 싶습니다. 그런 다음 정렬 가능한 구성 요소는 전달된 모든 항목을 사용자 정의 v-draggable 구성 요소로 래핑해야 합니다.

으아악

이제 v-sortable 组件，我尝试使用自定义 v-draggable 구성 요소를 사용하여 사용자 지정 v-sortable 구성 요소를 사용하여 기본 슬롯에 지정된 모든 노드를 래핑하려고 합니다. 내

구성요소는 다음과 같습니다.

으아악 v-draggable 不会呈现为 vue 组件。所有项目都将包装在名为 이것은 내 사용자 정의 구성 요소 v-draggable가 Vue 구성 요소로 렌더링되지 않는다는 점을 제외하면 예상대로 작동합니다. 모든 항목은 라는 html 태그로 래핑됩니다.

구성 요소를 Vue 구성 요소로 실제로 구문 분석하려면 어떻게 해야 하나요? 🎜

Answer 1

구성 요소는 렌더링 함수에서 명시적으로 지정할 수 있습니다.

으아아아

가져올 수 없는 전역 등록 구성 요소(예: 타사 라이브러리)는 resolveComponent를 통해 가져올 수 있습니다.

Answer 2

직접 가져오고 등록하고 다음을 사용해보세요.

으아악

항목을 소품으로 전달하고 렌더링 기능에서 직접 사용하는 것이 좋습니다.

으아악

하위 구성요소:

으아악