재귀적으로 채우고 렌더링하기
템플릿을 채우는 것은 데이터를 렌더링하기 위해 독립적인 템플릿을 사용하고 <template>
요소에 name
속성을 추가하여 중첩 구조의 데이터 렌더링을 구현하고 더 복잡한 컴포넌트를 만들 수 있도록 합니다.
x-fill
를 사용하여 채우기 렌더링을 할 때, 해당 템플릿 이름을 name
속성에 전달하면 독립적인 템플릿의 내용을 렌더링할 수 있습니다. 또한, 채우기 렌더링은 재귀적으로도 지원되며, 즉 내부 템플릿에서 동일한 템플릿 이름을 계속 사용하여 중첩 채우기를 구현할 수 있습니다.
예제에서는 독립적인 템플릿인 item
을 정의하고 x-fill
에서 해당 템플릿 이름을 전달했습니다. 이렇게 하면 데이터의 각 항목이 이 템플릿을 사용하여 렌더링되고, 템플릿 내에서 다시 동일한 템플릿 이름을 재귀적으로 채울 수 있습니다. 이 방식으로 데이터의 중첩 구조를 유연하게 처리하고 보다 복잡한 컴포넌트 렌더링을 구현할 수 있습니다.