If statement 在Svelte中是否有更好的方法包含条件HTML元素

我开始经常遇到这个问题。如果布尔值为true，我希望在其他元素周围包含一个元素。在下面的例子中，我做了两个if语句，但是如果我想要包装的代码很大，这将使它不清楚发生了什么。此外，还会有重复的代码。有没有更好的方法来解决这个问题

<script>
   let boolean = true;
</script>

{#if}
   <img src="source" />
{/if}

{#if}
   <a href="/home">
      <img src="source" />
   </a>
{/if}

设布尔=真；
{#如果}
{/if}
{#如果}
{/if}

如果这是您经常做的事情，您可以使用它制作一个

条件链接组件


导出let isWrapped=false；
出口许可证；
{#如果已包装}
{:else}
{/if}

它可以这样使用：


从“/ConditionalLink.svelte”导入ConditionalLink；
让wrapLink=false；
我是一个链接
包裹链接
是的。对我来说，测试何时使用包装组件的试金石是插槽中内容的复杂性。一旦它变得非常重要，我就会将if逻辑包装到组件中，以避免重复非常重要的标记。谢谢！我觉得这是最好的方法之一