添加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> 

一切都将在时隙中呈现。