添加VUE組件

Question

我有一個VUE組件Jumbotron.vue內部的內容：

<template lang="html"> 
    <div class="jumbotron" style="border-radius:0px; color:#fff;"> 
    <div class="container"> 

    </div> 
    </div> 
</template> 

和其他頁面組件Main.vue：

<template> 
    <div class="root"> 
    <navbar></navbar> 
    <jumbotron> 
     <h1 class="display-4">I want to add here, to the jumbotron's div container some h1 and paragraph</h1> 
     <p class="lead ">Like this paragraph</p> 
    </jumbotron> 
    <words></words> 
    </div> 
</template> 

，但我不能添加內容到超大屏幕，因爲它錯了。我不想在Jumbotron.vue裏面添加內容（p和h1），因爲我想在其中使用Jumbotron.vue多於一次的不同內容。這可能嗎？

Answer 1

這是用slots完成的。您在父把jumbotron組件內部

<template lang="html"> 
    <div class="jumbotron" style="border-radius:0px; color:#fff;"> 
    <div class="container"> 
     <slot></slot>  
    </div> 
    </div> 
</template> 

一切都將在時隙中呈現。