今兒個咱來聊聊slot這玩意兒。我是真沒搞懂這東西到底有啥用，感覺就像是多此一舉。后來隨著項目越做越大，組件越寫越多，我才慢慢體會到它的妙處。

初識slot

記得剛開始接觸的時候，是在做一個電商網站的項目。當時需要做一個商品列表的組件，每個商品都有圖片、標題、價格等等。我把這些東西都寫死在組件里，結果發現，不同的頁面，商品展示的樣子還不太一樣，有的要加個“新品”標簽，有的要顯示銷量，改起來那叫一個麻煩。

后來組長跟我說，可以用slot來解決這個問題。我當時還一臉懵逼，啥是slot？組長就給我演示一下，在組件里寫個，然后在使用組件的地方，把要顯示的內容直接寫在組件標簽里面，就像這樣：

<商品列表>

商品標題

價格：XXX

我一看，還真行！這樣一來，組件里就只管結構，具體顯示啥內容，完全由使用組件的地方決定，靈活多。

深入理解slot

后來我又遇到更復雜的情況。比如，有的商品列表，標題要在左邊，有的要在右邊，這可咋整？難道要寫兩個組件嗎？

這時候，我又學到slot的另一個用法，就是給slot起個名字。比如，我可以這樣寫：

然后，在使用組件的時候，就可以通過