vuejs模板，包括内部html

Question

我有一个自定义组件，我希望它打印给定的html。

<customComponent>
  <p>I want this to be shown at bottom of the created template</p>
</customComponent>

看似简单，但我找不到任何信息/示例。

Answer 1

您可以使用<slot>

在customComponent.vue中：

<template>
  <slot></slot>
</template>

然后：

<customComponent>
  <p>I want this to be shown at bottom of the created template</p>
</customComponent>

Answer 2

在您的“ CustomComponent.vue”中：

props: {
  text: String
}

及其模板：

<template>
  <p>{{text}}</p>
</template>

您可以这样添加它：

<custom-component text="I want this to be shown at bottom of the created template"></custom-component>