Reakit 正在参加 2020 年度 OSC 中国开源项目评选,请投票支持!
Reakit 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
投票让它出道
已投票
Reakit 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」 !
Reakit 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」「最积极运营项目」 !
Reakit 获得 2020 年度 OSC 中国开源项目评选「最积极运营项目」 !

软件简介

Reakit 是一个 React Web 应用开发工具包。

特性:

  • 便捷,无障碍:Reakit 严格遵循 WAI-ARIA 1.1 标准,所有组件都具有开箱即用的适当属性和键盘交互。
  • 可组合:Reakit 具有强大的可组合性,可以利用任何组件或 hook 来创建新事物。
  • 可自定义:默认情况下,核心库中 Reakit 组件没有样式化,每个组件都返回一个 HTML 元素,该元素接受所有 HTML 属性,包括 className 和 style。
  • 小而快:Reakit 组件使用现代 React 构建,并遵循最佳实践。每个导入的组件大小只有几个字节到最多 3 kB。

使用示例:

import { useRoverState, Rover } from "reakit/Rover";
import { Group } from "reakit/Group";
import { Button } from "reakit/Button";
function Example() {
const roving = useRoverState();
return (
<Group>
<Rover as={Button} {...roving}>
Button 1
</Rover>
<Rover as={Button} {...roving} disabled>
Button 2
</Rover>
<Rover as={Button} {...roving} disabled focusable>
Button 3
</Rover>
<Rover as={Button} {...roving}>
Button 4
</Rover>
<Rover as={Button} {...roving}>
Button 5
</Rover>
</Group>
);
}

 

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论 (4)

加载中
看不懂啊,不过为啥前段不需要注释
2019/05/16 13:43
回复
举报
这一堆 ...roving ,是不是可以简化一下?
2019/05/16 11:33
回复
举报
样例代码是认真的吗
2019/05/16 11:22
回复
举报
现在的前端这种代码我真接受不了
2019/05/16 11:14
回复
举报
更多评论
暂无内容
发表了博客
2018/11/06 12:17

推荐 9 个样式化组件的 React UI 库

简评:喜欢 CSS in JS 吗?本文将介绍一些使用样式组件所构建的 React UI 库,相信你会很感兴趣的。 在 React 社区,对 UI 组件进行样式化的讨论逐步从 CSS 模块到内联 CSS 再到 CSS in JS,非常热烈。 CSS in JS 的相对崛起,能更多地受到一些开发人员的青睐,与 React 组件生态系统的兴起以及 Max Stoiber 和 200 多个贡献者的样式化组件项目的兴起紧密相关。 为了节省大家的时间,我收集了一些有用的库,它们利用样式组件提供...

0
0
2018/11/06 12:16

推荐 9 个样式化组件的 React UI 库

> 简评:喜欢 CSS in JS 吗?本文将介绍一些使用样式组件所构建的 React UI 库,相信你会很感兴趣的。 在 React 社区,对 UI 组件进行样式化的讨论逐步从 CSS 模块到内联 CSS 再到 CSS in JS,非常热烈。 CSS in JS 的相对崛起,能更多地受到一些开发人员的青睐,与 React 组件生态系统的兴起以及 Max Stoiber 和 200 多个贡献者的样式化组件项目的兴起紧密相关。 为了节省大家的时间,我收集了一些有用的库,它们利用样式组件提...

0
8
发表于服务端专区
2020/09/05 09:00

顶级React组件库推荐

作者丨Max Rozen 译者丨王强 策划丨小智 本文最初发布于 maxrozen.com 网站,经原作者授权由 InfoQ 中文站翻译并分享。 Ant Design 项目链接: Ant Design https://ant.design/ 包大小(来自 BundlePhobia):缩小后 1.2mB,缩小 +gzip 压缩后 349.2kB,通过摇树减少体积。 优点: AntDesign 随附了大量支持文档,有一个社区,包括一个带有预制模板的单独项目(AntDesignPro); 可用来快速设计后台 / 内部应用的 UI 库。 缺点:...

0
0
2020/09/06 07:00

顶级React组件库推荐

(给前端开发博客加星标,提升前端技能) 作者丨Max Rozen 译者丨王强 策划丨小智 本文最初发布于 maxrozen.com 网站,经原作者授权由 InfoQ 中文站翻译并分享。 Ant Design 项目链接: Ant Design https://ant.design/ 包大小(来自 BundlePhobia):缩小后 1.2mB,缩小 +gzip 压缩后 349.2kB,通过摇树减少体积。 优点: AntDesign 随附了大量支持文档,有一个社区,包括一个带有预制模板的单独项目(AntDesignPro); 可用来...

0
0
发表了博客
2020/11/27 16:41

50个好用的前端框架,千万收好以留备用!

此文转载自:https://my.oschina.net/u/3704591/blog/4753326 大咖揭秘Java人都栽在了哪?点击免费领取《大厂面试清单》,攻克面试难关~>>> 来源 | https://www.jianshu.com/p/182b69e54fe8 今天跟你分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助。 一、构建工具 1、 Parcel 地址:https://parceljs.org/ Parcel是一款极速零配置WEB应用打包工具,快速、几乎零配置是它最大的特点,开箱即用。相比webpack,P...

0
0
发表了博客
2020/11/27 15:23

50个好用的前端框架,千万收好以留备用!

此文转载自:https://my.oschina.net/u/3704591/blog/4753326 大咖揭秘Java人都栽在了哪?点击免费领取《大厂面试清单》,攻克面试难关~>>> 来源 | https://www.jianshu.com/p/182b69e54fe8 今天跟你分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助。 一、构建工具 1、 Parcel 地址:https://parceljs.org/ Parcel是一款极速零配置WEB应用打包工具,快速、几乎零配置是它最大的特点,开箱即用。相比webpack,P...

0
0
2020/12/29 11:40

50个好用的前端框架,千万收好以留备用!

来源 | https://www.jianshu.com/p/182b69e54fe8 今天跟你分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助。 一、构建工具 1、 Parcel 地址:https://parceljs.org/ Parcel是一款极速零配置WEB应用打包工具,快速、几乎零配置是它最大的特点,开箱即用。相比webpack,Parcel对于新手来说未尝不是一个很好的选择。 2、 Critters 地址:github.com 一款webpack的插件,它可以很方便的配置内联关键css( critical...

0
0
发表于大前端专区
2020/11/27 10:58

50个好用的前端框架,千万收好以留备用!

来源 | https://www.jianshu.com/p/182b69e54fe8 今天跟你分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助。 一、构建工具 1、 Parcel 地址:https://parceljs.org/ Parcel是一款极速零配置WEB应用打包工具,快速、几乎零配置是它最大的特点,开箱即用。相比webpack,Parcel对于新手来说未尝不是一个很好的选择。 2、 Critters 地址:github.com 一款webpack的插件,它可以很方便的配置内联关键css( critical...

0
27
2020/12/23 10:00

50个好用的前端框架,赶紧收藏!

△ 是新朋友吗?记得先点web前端学习圈关注我哦~ 今天跟你分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助。 一、构建工具 1、 Parcel 地址:https://parceljs.org/ Parcel是一款极速零配置WEB应用打包工具,快速、几乎零配置是它最大的特点,开箱即用。相比webpack,Parcel对于新手来说未尝不是一个很好的选择。 2、 Critters 地址:github.com 一款webpack的插件,它可以很方便的配置内联关键css( critical...

0
0
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
暂无内容
4 评论
3 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部