Svelte中如何将对象成员Store的值作为Prop传递？

我有一个包含Svelte Store的项目列表，类型定义如下：

interface Item {
  isAvailable: Writable<boolean>;
}

现在需要遍历这些项目，把每个item里isAvailable这个Store的值传递给一个接收boolean类型Prop的组件<Component>。我原本希望能用类似下面的简洁语法：

{#each items as item}
  <Component isEnabled={item.$isAvailable} />
{/each}

但这种写法并不生效。我目前想到的最优解是封装一个中间组件，但感觉样板代码太多：

<script>
  export let item: Item;

  $: isAvailable = item.isAvailable;
</script>

<Component isEnabled={$isAvailable} />

方法1：用{#const}在循环内直接订阅 #

在#each循环中使用{#const}声明反应式常量，直接订阅Store的值，语法简洁且保持响应性：

{#each items as item}
  {#const isEnabled = $item.isAvailable}
  <Component {isEnabled} />
{/each}

方法2：内联$()语法直接取值 #

可以直接在Prop中用$()语法获取Store的当前值，无需额外变量：

{#each items as item}
  <Component isEnabled={$($item.isAvailable)} />
{/each}

这种写法更紧凑，但可读性稍弱，适合简单场景。

方法3：优化中间组件（复用场景） #

如果需要在多个地方复用该逻辑，可以保留中间组件，但简化代码——不需要额外声明中间变量，直接在模板中使用Store订阅语法：

<script lang="ts">
  import Component from './Component.svelte';
  export let item: Item;
</script>

<Component isEnabled={$item.isAvailable} />

内容的提问来源于stack exchange，提问作者Ben