svelt 조건문에 옵션 _outer_ 태그를 추가할 수 있습니까?

svelt 조건문에 옵션 _outer_ 태그를 추가할 수 있습니까?

조건문을 사용하여 내부 내용을 선택적 외부 요소로 감싸는 것이 가능합니까?

다음은 유효한 Svelte에서 수행하고자 하는 작업의 예입니다:

<script>
  export let needs_div_wrapper;
</script>

{#if needs_div_wrapper}
  <div>
    <a>My static content!</a>
  </div>
{:else}
  <a>My static content!</a>
{/if}

다음은 유효하지 않은 Svelte에서 수행하고자 하는 작업을 보여주는 예입니다:

...

{#if needs_div_wrapper}
  <div>
{/if}
    <a>My static content!</a>
{#if needs_div_wrapper}
  </div>
{/if}

편집: 명확성을 위해, 저는 이것을 내부 콘텐츠의 새로운 구성 요소로 달성하려고 노력하고 있습니다.

---

아니요, 불가능해요.

이 경우 "상위" 구성 요소에서 잠재적으로 사소한 마크업이 반복되지 않도록 래퍼 구성 요소가 가장 깔끔할 것입니다.

제가 이해하는 바로는, 이미 이 솔루션을 찾으셨지만, 공식적으로 제가 말씀드리는 것은 다음과 같습니다:

DivWrapper.svelte

<script>
  export let wrap = false
</script>
{#if wrap}
  <div {...$$restProps}>
    <slot />
  </div>
{:else}
  <slot />
{/if}

App.svelte

<script>
  import DivWrapper from './DivWrapper.svelte'

  export let needs_div_wrapper;
</script>

<DivWrapper wrap={needs_div_wrapper}>
  <a>My static content!</a>
</DivWrapper>