本文是深入浅出ahooks源码系列文章的第一篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。第一篇主要介绍ahooks的背景以及整体架构。Reacthooksutils库自从React16.8版本推出Reacthooks，越来越多的项目使用FunctionComponent。Reacthooksutils库随即诞生，它主要解决的两个问题如下：公共逻辑的抽象。解决Reacthooks存在的弊端，比如闭包等。那现在社区有哪些比较优秀的ReactHooksutils库呢？react-use是社区比较活跃的Reacthooksutils库，它的star数达到了29.6k
本文是深入浅出ahooks源码系列文章的第一篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。第一篇主要介绍ahooks的背景以及整体架构。Reacthooksutils库自从React16.8版本推出Reacthooks，越来越多的项目使用FunctionComponent。Reacthooksutils库随即诞生，它主要解决的两个问题如下：公共逻辑的抽象。解决Reacthooks存在的弊端，比如闭包等。那现在社区有哪些比较优秀的ReactHooksutils库呢？react-use是社区比较活跃的Reacthooksutils库，它的star数达到了29.6k
本文是深入浅出ahooks源码系列文章的第十五篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。本篇接着针对关于DOM的各个Hook封装进行解读。useFullscreen管理DOM全屏的Hook。该hook主要是依赖screenfull这个npm包进行实现的。选择它的原因，估计有两个：它的兼容性好，兼容各个浏览器的全屏API。简单，包体积小。压缩后只要1.1k。大概介绍几个它的API。.request(element,options?)。使一个元素全屏显示。默认元素是.exit()。退出全屏。.toggle(element,options?)。假如目前是全屏，则
本文是深入浅出ahooks源码系列文章的第十五篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。本篇接着针对关于DOM的各个Hook封装进行解读。useFullscreen管理DOM全屏的Hook。该hook主要是依赖screenfull这个npm包进行实现的。选择它的原因，估计有两个：它的兼容性好，兼容各个浏览器的全屏API。简单，包体积小。压缩后只要1.1k。大概介绍几个它的API。.request(element,options?)。使一个元素全屏显示。默认元素是.exit()。退出全屏。.toggle(element,options?)。假如目前是全屏，则
本文是深入浅出ahooks源码系列文章的第十三篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。本篇文章探讨一下ahooks对DOM类Hooks使用规范，以及源码中是如何去做处理的。DOM类Hooks使用规范这一章节，大部分参考官方文档的DOM类Hooks使用规范。第一点，ahooks大部分DOM类Hooks都会接收target参数，表示要处理的元素。target支持三种类型React.MutableRefObject（通过useRef保存的DOM）、HTMLElement、()=>HTMLElement（一般运用于SSR场景）。第二点，DOM类Hooks的tar
本文是深入浅出ahooks源码系列文章的第十三篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。本篇文章探讨一下ahooks对DOM类Hooks使用规范，以及源码中是如何去做处理的。DOM类Hooks使用规范这一章节，大部分参考官方文档的DOM类Hooks使用规范。第一点，ahooks大部分DOM类Hooks都会接收target参数，表示要处理的元素。target支持三种类型React.MutableRefObject（通过useRef保存的DOM）、HTMLElement、()=>HTMLElement（一般运用于SSR场景）。第二点，DOM类Hooks的tar
本文是深入浅出ahooks源码系列文章的第十一篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。本文来讲下ahooks中的useUrlState。通过urlquery来管理state的Hook。useUrlState的特殊在之前的架构篇中我们就提到，ahooks这个项目是一个monoRepo。它的项目管理是通过lerna进行管理的。可以从官网以及源码中看到useUrlState是独立一个仓库进行管理的。也就是你必须单独安装：npmi@ahooksjs/use-url-state-S我认为官方这么做的理由是useUrlState基于react-router的useL
本文是深入浅出ahooks源码系列文章的第十一篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。本文来讲下ahooks中的useUrlState。通过urlquery来管理state的Hook。useUrlState的特殊在之前的架构篇中我们就提到，ahooks这个项目是一个monoRepo。它的项目管理是通过lerna进行管理的。可以从官网以及源码中看到useUrlState是独立一个仓库进行管理的。也就是你必须单独安装：npmi@ahooksjs/use-url-state-S我认为官方这么做的理由是useUrlState基于react-router的useL
本文是深入浅出ahooks源码系列文章的第七篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。今天我们来聊聊定时器。useInterval和useTimeout看名称，我们就能大概知道，它们的功能对应的是setInterval和setTimeout，那对比后者有什么优势？先看useInterval，代码简单，如下所示：functionuseInterval(fn:()=>void,delay:number|undefined,options?:{immediate?:boolean;},){constimmediate=options?.immediate;con
本文是深入浅出ahooks源码系列文章的第七篇，该系列已整理成文档-地址。觉得还不错，给个star支持一下哈，Thanks。今天我们来聊聊定时器。useInterval和useTimeout看名称，我们就能大概知道，它们的功能对应的是setInterval和setTimeout，那对比后者有什么优势？先看useInterval，代码简单，如下所示：functionuseInterval(fn:()=>void,delay:number|undefined,options?:{immediate?:boolean;},){constimmediate=options?.immediate;con
