Question

我正在从具有store作为其某些属性的对象数组中构建仪表板。每个商店都从不同来源独立更新。

我的问题是我无法读取store循环内的each值。

为简化以下代码示例，我使用tweened代替store

Svlete REPL中也提供以下代码 https://svelte.dev/repl/9a17102e7d32471a940ba007e5b56db0?version=3.6.7

<script>
    import { tweened } from 'svelte/motion';

    const data = [{
        label: 'one',
        value: tweened(0)
    }, {
        label: 'two',
        value: tweened(0)
    }]

</script>

<ul>
    {#each data as item}
        <li>{item.label} ({item.$value})</li>
    {/each}
</ul>

{item.$value}部分返回undefined

Answer 1

这目前无法实现-“关联商店”（#2016）尚有一个问题，您可以通过这种方式进行处理...

<ul>
  {#each data as { label, value }}
    <li>{label} ({$value})</li>
  {/each}
</ul>

...但是我们还没到那儿。同时，解决方法是将商店传递给组件：

<ul>
  {#each data as item}
    <ListItem label={item.label} value={item.value}/>
  {/each}
</ul>

在组件内部，您将拥有export let label, value，并且可以按预期使用$value。

在SvelteJS v3中的循环内访问商店的值

1 个答案: