Svelte Each 塊

如果你遇到需要遍歷的數(shù)據(jù)列表，請使用 ?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>

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

你也可以將index 作為第二個參數(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 }來解構(gòu)，用cat.id 和 cat.name 來代替 id 和 name。