這篇文章給大家分享的是有關(guān)slot都是用在子組件的原因的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考。一起跟隨小編過來看看吧。

使用slot場景一：

子組件Minput.vue

父組件 Minput

可以顯示嗎

這種情況下  Minput標簽內(nèi)的文字是不會渲染出來的

如果現(xiàn)在想在里面把文字渲染出來怎么辦

好 用slot

子組件

這樣的話，父組件的里面的文字就可以渲染出來

場景二：具名插槽

子組件 he.vue

父組件

    
hello world

渲染出來的結(jié)果就是

hello world

場景三

子組件 child

    
這是h2
    這是分發(fā)內(nèi)容,只有在沒有分發(fā)內(nèi)容的情況下顯示

父組件

    
這是一段p
    
兩段p

渲染出來就是

這是h2
這是一段p
兩段p

如果父組件

那么渲染出來的就是

這是h2
這是分發(fā)內(nèi)容，只有在沒有分發(fā)內(nèi)容的情況下顯示

場景四:作用域插槽

父組件

x渲染的話就是

  

    hello from parent
    hello from child
  

感謝各位的閱讀！關(guān)于slot都是用在子組件的原因就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！