插槽樣式 vue 插槽2

1.編譯作用域

父級模板裡的所有內容都是在父級作用域中編譯的;子模板裡的所有內容都是在子作用域中編譯的。在開發階段}在哪就是哪的責任，不是最終在哪呈現是哪的責任。

主頁面傳遞

頭部：}

身體

底部

slots頁面呈現

2.作用域插槽實現頭部字型變大，在子模板裡只是載入作用,不能改變樣式,要想改變只能到父模板裡。很簡單的乙個理解方案就是當我們使用插槽的時候，其實就是兒子的資料交給父親渲染，最終在交給兒子呈現。主頁面傳遞

頭部：}

身體底部

slots頁面呈現

理解了作用域插槽，我們來看怎麼傳遞資料。在子元素定義好資料，通過的方式傳遞給父元素，父元素通過v-slot:default 來接收資料，然後在子元素呈現。不知道有沒有經過父元素就在父元素裡加乙個樣式。子頁面呈現

//傳遞資料

主頁面傳遞頭部//接收資料，這個時候發現有兩給v-slot就會衝突，所以換一種方式

////新增字型為紅色

身體：}

底部