如果有很多重複一樣的東西該怎麼辦

昨天教授大家怎麼抽組件以及如何傳遞資料給組件，但是如果有很多相同的html或是同樣的組件要如何處理呢？今天就來告訴大家在svelte怎麼辦。

本文同步放置於此

foreach迴圈

相信學習任何語言都會有foreach因為這是讓工程師做事有效率的方法之一，當然除了javascript有foreach之外，svelte也有自己的語法在html上跑迴圈他的語法如下。

{#each items as item}
	<li>{item.name} x {item.qty}</li>
{/each}

簡單說明就是{#each 序列 as 序列中的每個物件}當開頭{/each}當結尾，中間夾著html語法，使用變數就如同之前一般用{}即可。

就因為中間夾著html語法，所以組件也可以直接用如下所示。

{#each nameList as name}
    <HelloWorld ｛name} />
{/each}

如此就可以完成重複的html了。

小結

今天教授大家如何使用svelte的foreach，但是如果陣列內有資料不想要呈現又該如何處理呢？待明天再教授大家if判斷式。