javascript - 如何迭代 Svelte 商店中的数组？

Question

我在 store.ts 中有一个数组

export let annotations = writable(new Array<Annotation>());

我想在 component.svelte 中遍历数组:

<script lang="ts">
  import { annotations } from '../store';
</script>

<section>
  {#each annotations as highlight, index}
    ...
  {/each}
</section>

这失败了:

Argument of type 'Writable<Annotation[]>' is not assignable to parameter of type 'ArrayLike'

这是有道理的 - Writable 对象不是常规数组，它是一个 Writable。

如何在 Svelte 商店中迭代数组？

Answer 1

在 component.svelte 中遍历数组:

<script lang="ts">
  import { annotations } from '../store';
</script>

<section>
  {#each $annotations as highlight, index}
    ...
  {/each}
</section>

More info