寫作用域插槽之前，先介紹一下Vue中的slot內容分發： 如果<child-component></child-component>標簽之間沒有插入那兩個p標簽的話，頁面會顯示子組件模板中定義的“<p>父組件如果沒有插入內容，我將被顯示</p>”這一則內容，但如果<child-component>< ...
寫作用域插槽之前，先介紹一下Vue中的slot內容分發：
如果<child-component></child-component>標簽之間沒有插入那兩個p標簽的話，頁面會顯示子組件模板中定義的“<p>父組件如果沒有插入內容，我將被顯示</p>”這一則內容，但如果<child-component></child-component>標簽之間有插入內容的話，則子組件模板中的<slot></slot>標簽以及之間的內容都會被替換成<child-component></child-component>標簽之間插入的內容。
這裡子組件<slot>內的備用內容，作用域是子組件本身；
作用域插槽：
顯示結果：
template內可以通過臨時變數props來訪問來自子組件插槽的數據msg
作用域插槽更具代表性的用例是列表組件：
子組件<my-list></my-list>接受一個父組件傳過來的books數組。並且將它在name為book的slot上使用v-for迴圈，同時暴露變數bookName，父組件的my-list標簽內就可以通過props.bookName訪問到綁定的數據；
作用域插槽的使用場景：既可以復用子組件的slot，又可以使slot內容不一致；
