1 前言
Svelte 中条件渲染使用{#if ...} ... {/if} 声明，那列表渲染是不是类似：{#for ...} ... {/for}？
2 正文
Svelte 中的列表渲染使用跟条件渲染类似的语法，不过关键字换成了 each，item 可以解构，这样看起来比较清晰。
<script> const list = [ { name: "lilei", age: 21 }, { name: "hanmeimei", age: 24 }, { name: "lihua", age: 18 }, { name: "zhangsan", age: 22 }, ]; </script> <ul> <!-- {#each list as item} --> {#each list as { name, age }} <li>{name} - {age}</li> {/each} </ul>
3 总结
条件渲染用 {#if}，列表渲染用 {#each}。