RKRK UI Docs

组件参考与可运行示例

每个组件都按“适用场景、真实渲染、属性、插槽、事件、公开方法、可复制示例”说明。布局上下距离由 rk-stack 统一承担，原子组件不附带默认外边距。

61 个组件Vue 2 / Vue 3 / React / 原生零运行时依赖设计 Token 驱动

快速开始

全局引入后，即可直接使用浏览器原生的 rk-* 自定义元素。

import '@rk911/store-ui';
import '@rk911/store-ui/styles/tokens.css';

事件约定

属性使用 kebab-case；业务事件统一为 rk-*，参数位于 event.detail。

document.querySelector('rk-button')
  .addEventListener('rk-click', saveDraft);

Vue / React 接入提示

Vue 3 在编译配置中将 rk-* 设为 custom element；Vue 2 使用 ignoredElements。React 通过 ref 的 addEventListener 监听 rk-click、rk-change 等原生 CustomEvent。