react haiku
v2.1.8
Haiku是一个简单且轻巧的React库，目的是保存
您通过提供大量挂钩和公用事业的时间
帮助您更快，更有效地完成工作！
安装haiku非常简单！
需要React> = 16.8.0
npm install react-haikuyarn add react-haikupnpm install react-haiku该项目将开玩笑用作测试框架，并用来测试库（RTL）来测试反应组件和钩子。
要执行所有单位测试，并启用了覆盖范围
npm run test 请检查官方文档以获取完整的用法示例。
import { useHover } from 'react-haiku' ;
const Component = ( ) => {
const { hovered , ref } = useHover ( ) ;
return < p ref = { ref } > { hovered ? 'All mice on me' : 'No mice on me' } </ p > ;
} ;
export default Component ; import { For } from 'react-haiku' ;
const Component = ( ) => {
const list = [ { name : 'React' } , { name : 'Haiku' } ] ;
render (
< >
< For each = { list } render = { ( item , index ) => < p > { item . name } </ p > } />
</ > ,
) ;
} ;
export default Component ; Haiku始终对改进和贡献开放，如果您想贡献，您可以检查开放问题，并且还可以使用功能请求模板请求添加自己的改进/想法。在贡献之前，请阅读贡献指南，并确保尊重标准！谢谢您的宝贵时间！
useClipboard() - 将数据复制到用户的剪贴板！useHover() - 快速检测鼠标是否超过元素的方法！useInputValue() - 使用此简单挂钩管理输入状态！useLeaveDetection() - 检测用户的光标何时离开页面！useMediaQuery() - 使用媒体查询来操纵您的组件！useMousePosition() - 检测鼠标相对于目标或整个文档的当前位置！usePrefersTheme() - 检测用户的首选系统主题！useScript() - 将脚本标签附加到您的组件中的文档！useToggle() - 在两个不同的选项之间切换状态值！useBoolToggle() - 切换布尔状态值！useUrgentUpdate() - 调用此挂钩时强制渲染组件！useClickOutside() - 检测目标元素之外的点击！useConfirmExit() - 如果状态设置为Dirty，请在关闭选项卡之前提示用户使用消息。useDebounce() - 延迟后，审阅状态更改以对更新做出反应！useEventListener() - 在窗口对象或特定目标元素上设置事件侦听器！useFavicon() - 从组件中动态更新网站的Favicon！useFirstRender() - 检查组件是否在其第一个渲染上！useHold() - 处理目标元素上的长按下，并在设定延迟后执行处理程序！useIdle() - 根据事件在页面上检测用户活动/不活动！useIsomorphicLayoutEffect() - 根据执行环境（SSR vs浏览器）在使用效果和USELAYOUTEFFECT之间切换！useLocalStorage() - 动态管理localstorage值useScrollPosition() - 访问页面上的当前滚动位置，并通过编程进行修改。useSingleEffect() - 安装组件时仅严格地运行使用效果挂钩！useTitle() - 从组件中更新文档的标题！useUpdateEffect() - 类似于使用效果，但它跳过了组件的第一个渲染，并且仅对依赖关系值触发的更新反应。If - 简单条件渲染的组件！Show - 复杂条件渲染的组件！For - 具有自动键分配的动态渲染组件！RenderAfter组件在设定延迟后呈现其子女。Image - 简化渲染图像过程的组件。 大卫·哈兹（David Haz）
麻省理工学院
