Label
渲染与控件相关联的无障碍访问标签。
功能特性
- 双击标签时禁止文本选中
- 支持嵌套控件
安装
通过命令行安装该组件。
sh
$ npm add reka-ui结构解剖
导入该组件。
vue
<script setup>
import { Label } from 'reka-ui'
</script>
<template>
<Label />
</template>API 参考
根元素 (Root)
包含标签的内容。
| Prop | Default | Type |
|---|---|---|
as | 'label' | AsTag | ComponentThe element or component this component should render as. Can be overwritten by |
asChild | booleanChange the default rendered element for the one passed as a child, merging their props and behavior. Read our Composition guide for more details. | |
for | stringThe id of the element the label is associated with. |
无障碍访问
此组件基于原生 label 元素，在包裹控件或使用 for 属性时，它将自动应用正确的标签标注。为确保您自定义的控件正常工作，请确保它们使用如 button 或 input 之类的原生元素作为基础。