Svelte Each 塊

如果你遇到需要遍歷的數(shù)據(jù)列表，請(qǐng)使用 ?each? 塊：

<ul>
	{#each cats as cat}
		<li><a target="_blank"  rel="external nofollow" target="_blank"  rel="external nofollow" target="_blank" >
			{cat.name}
		</a></li>
	{/each}
</ul>

表達(dá)式 ?cats?是一個(gè)數(shù)組，遇到數(shù)組或類似于數(shù)組的對(duì)象 (即具有?length? 屬性)。你都可以通過(guò) ?each [...iterable]?遍歷迭代該對(duì)象。

你也可以將index 作為第二個(gè)參數(shù)(key)，類似于：

{#each cats as cat, i}
	<li><a target="_blank"  rel="external nofollow" target="_blank"  rel="external nofollow" target="_blank" >
		{i + 1}: {cat.name}
	</a></li>
{/each}

如果你希望代碼更加健壯，你可以使用each cats as { id, name }來(lái)解構(gòu)，用cat.id 和 cat.name 來(lái)代替 id 和 name。