如何在 vue3 中使用模板而不是原生模板？

Question

这是一个动态组件：

<component :is="props.as || 'li'">
  <slot />
</component>

但是如果 prop.as 是 'template'，它会在 html 原生模板中呈现，并且无法在浏览器中看到它

我期待结果：

Vue 文档显示一些细节

但是我不能在上面添加任何导演，就像这样

<component
  :is="props.as || 'li'"
  v-if="true"
>

任何人都可以帮助我吗？

Answer 1

您可能不应该将 component 标记用于您要执行的操作。

根据Vue docs：

要渲染的实际组件由 is 属性决定。

• 当is 为字符串时，它可以是 HTML 标签名称或组件的注册名称。

• 或者，is 也可以直接绑定到组件的定义。

您正在尝试传递 template 而不是 Vue 组件，component 不适用于该组件。目前还不清楚你到底想做什么，但你可以使用 slot 来完成它。否则，要使 component 标签起作用，请定义一个 Vue 组件并将其传入。