Reka UI 标志Reka
backdrop
实用工具

原语

将 Reka 的功能组合到其他元素类型或您自己的 Vue 组件上。

在构建组件时,有时您可能希望允许用户将某些功能组合到基础元素或其他元素上。这就是 Primitive 派上用场的地方,因为它向用户公开了此功能。

API 参考

属性默认类型
as
div
字符串 | 组件

当前元素应渲染为的元素或组件。可以被 asChild 覆盖

asChild
false
布尔值

更改默认渲染元素为作为子项传递的元素,合并它们的属性和行为。

阅读我们的 组合 指南以获取更多详情。

用法

更改 as

如果您想更改默认渲染的元素或组件,可以在定义 props 时设置默认的 as

vue
<script setup lang="ts">
import type { PrimitiveProps } from 'reka-ui'
import { Primitive } from 'reka-ui'

const props = withDefaults(defineProps<PrimitiveProps>(), {
  as: 'span'
})
</script>

<template>
  <!-- Now this element will be rendered as `span` by default -->
  <Primitive v-bind="props">
    ...
  </Primitive>
</template>

渲染 asChild

更改默认渲染元素为作为子项传递的元素,合并它们的属性和行为。

阅读我们的 组合 指南以获取更多详情。