- 综合排序
- 最热优先
- 最新优先
- </> ); }; 那 ahooks 是怎么处理这两点的呢？ 参考资料 [1] DOM 类 Hooks 使用规范: https://ahooks.js.org/zh-CN/guide/dom来自专栏前端杂货铺-Gopal
ahooks 是怎么处理 DOM 的？
本文是深入浅出 ahooks 源码系列文章的第十三篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 本篇文章探讨一下 ahooks 对 DOM 类 Hooks 使用规范，以及源码中是如何去做处理的。 第一点，ahooks 大部分 DOM 类 Hooks 都会接收 target 参数，表示要处理的元素。 'hover' : 'leaveHover'}
78210编辑于 2022-08-01
ahooks 是怎么解决用户多次提交问题？
本文是深入浅出 ahooks 源码系列文章的第四篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[2] 如何使用插件化机制优雅的封装你的请求hook [3] ahooks 是怎么解决 React 的闭包问题的？ [4] 本文来探索一下 ahooks 的 useLockFn。 场景 试想一下，有这么一个场景，有一个表单，你可能多次提交，就很可能导致结果不正确。 这就是 ahooks 的 useLockFn 做的事情。 useLockFn useLockFn 用于给一个异步函数增加竞态锁，防止并发执行。
大家都能看得懂的源码之ahooks useInfiniteScroll
本文是深入浅出 ahooks 源码系列文章的第十七篇，该系列已整理成文档-地址[1]。觉得还不错，给个 star[2] 支持一下哈，Thanks。 本文已收录到个人博客[8]中，欢迎关注~ 参考资料 [1]地址: https://gpingfeng.github.io/ahooks-analysis/ [2]star: https://github.com /GpingFeng/ahooks-analysis [3]官网: https://ahooks.gitee.io/zh-CN/hooks/use-infinite-scroll [4]useRequest : https://ahooks.gitee.io/zh-CN/hooks/use-request/index [5]scrollTop: https://developer.mozilla.org/zh-CN
ahooks 中那些控制“时机”的hook都是怎么实现的？
注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 本文来探索一下 ahooks 是怎么封装 React 的一些执行“时机”的？ 基于 useEffect/useLayoutEffect，ahooks 做了一些封装，能够让你更加清晰的知道你的代码执行时机。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[3] 如何使用插件化机制优雅的封装你的请求hook [4] ahooks 是怎么解决 React 的闭包问题的？ [5] ahooks 是怎么解决用户多次提交问题？
ahooks 是怎么解决 React 的闭包问题的？
本文是深入浅出 ahooks 源码系列文章的第三篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[2] 如何使用插件化机制优雅的封装你的请求hook [3] 本文来探索一下 ahooks 是怎么解决 React 的闭包问题的？。 ahooks 也意识到了这个问题，通过 useLatest 保证获取到最新的值和 useMemoizedFn 持久化 function 的方式，避免类似的闭包陷阱。 值得一提的是 useMemoizedFn 是 ahooks 输出函数的标准，所有的输出函数都使用 useMemoizedFn 包一层。
大家都能看得懂的源码（一）ahooks 整体架构篇
注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 第一篇主要介绍 ahooks 的背景以及整体架构。 ahooks 简介 官方介绍如下： ahooks，发音 [eɪ hʊks]，是一套高质量可靠的 React Hooks 库。 如下所示： 图来自网络，侵删 ahooks 整体架构 项目启动 我们先从 ahooks 中 folk 一份[4]，clone 下来。 跟 hooks 相似的组织形式 可以用以下一张图，大致总结一下 ahooks 的工程架构： hooks 刚刚也提到，ahooks 是采用了 monoRepo 的方式，我们的源码都是在 packages https://github.com/streamich/react-use [3]ahooks: https://ahooks.js.org/zh-CN/guide [4]一份: https://github.com
【Hooks 小贴士】：state 相关 Hooks
true)}>set ON</button> <button onClick={() => toggle(false)}>set OFF</button>
如何封装 cookie/localStorage/sessionStorage hook?
本文是深入浅出 ahooks 源码系列文章的第九篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 今天来看看 ahooks 是怎么封装 cookie/localStorage/sessionStorage 的。 该方法的入参会判断是否为浏览器环境，以决定是否使用 localStorage，原因在于 ahooks 需要支持服务端渲染。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[4] 如何使用插件化机制优雅的封装你的请求hook [5] ahooks 是怎么解决 React 的闭包问题的？ [6] ahooks 是怎么解决用户多次提交问题？[7] ahooks 中那些控制“时机”的hook都是怎么实现的？[8] 如何让 useEffect 支持 async...await？
【Hooks 小贴士】：LifeCycle 相关 Hooks
备注：更喜欢 ahooks 版实现，简洁。 源码： ahooks——useMount 实现 阿里的实现很直接，useEffect + [] 依赖 react-use——useMount 实现 react-use 内部采用 useEffectOnce 备注：更喜欢 ahooks 版实现，简洁。 示例： 源码： ahooks——useUnmount 实现 react-use——useUnmount 实现 4. useUpdate 用途：强制组件重新渲染的 hook。 备注： ahooks 实现的是 useUnmountedRef ； react-use 实现的是 useMountedState。
记录第一次给开源项目提 PR
本文是深入浅出 ahooks 源码系列文章的第八篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[4] 如何使用插件化机制优雅的封装你的请求hook [5] ahooks 是怎么解决 React 的闭包问题的？ [6] ahooks 是怎么解决用户多次提交问题？[7] ahooks 中那些控制“时机”的hook都是怎么实现的？[8] 如何让 useEffect 支持 async...await？ : https://juejin.cn/post/7106061970184339464 [7]ahooks 是怎么解决用户多次提交问题？
大家都能看得懂的源码之 ahooks useVirtualList 封装虚拟滚动列表
本文是深入浅出 ahooks 源码系列文章的第十八篇，该系列已整理成文档-地址[1]。觉得还不错，给个 star[2] 支持一下哈，Thanks。 参考资料 [1]地址: https://gpingfeng.github.io/ahooks-analysis/ [2]star: https://github.com/GpingFeng/ahooks-analysis [3]官网: https://ahooks.gitee.io/zh-CN/hooks/use-virtual-list [4]这里: https://github.com/GpingFeng/hooks
通过这两个 hook 回顾 Set/Map 基础知识
本文是深入浅出 ahooks 源码系列文章的第十篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[2] 如何使用插件化机制优雅的封装你的请求hook [3] ahooks 是怎么解决 React 的闭包问题的？ [4] ahooks 是怎么解决用户多次提交问题？[5] ahooks 中那些控制“时机”的hook都是怎么实现的？[6] 如何让 useEffect 支持 async...await？ : https://juejin.cn/post/7106061970184339464 [5]ahooks 是怎么解决用户多次提交问题？ : https://juejin.cn/post/7106461530232717326 [6]ahooks 中那些控制“时机”的hook都是怎么实现的？
useEffect 怎么支持 async...await
本文是深入浅出 ahooks 源码系列文章的第六篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 我们来看下 ahooks 的 useAsyncEffect，它支持所有的异步写法，包括 generator function。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[3] 如何使用插件化机制优雅的封装你的请求hook [4] ahooks 是怎么解决 React 的闭包问题的？ [5] ahooks 是怎么解决用户多次提交问题？[6] ahooks 中那些控制“时机”的hook都是怎么实现的？
如何让定时器在页面最小化的时候不执行？
本文是深入浅出 ahooks 源码系列文章的第七篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 今天我们来聊聊定时器。 所以，ahooks 也提供了使用 requestAnimationFrame 进行模拟定时器处理的 hook，我们一起来看下。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[3] 如何使用插件化机制优雅的封装你的请求hook [4] ahooks 是怎么解决 React 的闭包问题的？ [5] ahooks 是怎么解决用户多次提交问题？[6] ahooks 中那些控制“时机”的hook都是怎么实现的？[7] 如何让 useEffect 支持 async...await？
vue2升级vue3：vue3 hooks库选用
之前a-hooks：https://ahooks.js.org/，比react-use 精简好用。但是没有vue版本的。 网上有个人实现的:https://github.com/dewfall123/ahooks-vue但是vue，还是选择vue-use好点。
如何使用插件化机制优雅的封装你的请求hook
本文是深入浅出 ahooks 源码系列文章的第二篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读，可见 详情[1]。 系列文章： 大家都能看得懂的源码（一）ahooks 整体架构篇[2] 本文来讲下 ahooks 的核心 hook —— useRequest。 参考 软件设计之Deep Module（深模块）[3] 精读 ahooks useRequest 源码[4] 参考资料 [1]详情: https://github.com/GpingFeng/hooks [2]大家都能看得懂的源码（一）ahooks 整体架构篇: https://juejin.cn/post/7105396478268407815 [3]软件设计之Deep Module（深模块）: https
关于Free自由协议增发逻辑技术开发详细丨Free模式系统开发项目方案讲解
本文探讨ahooks 对 DOM 类 Hooks 使用规范，以及在《free dom自由协议质押系统》开发过程中 源码是如何去做处理的，有需求和问题的朋友可以来探讨。 一点，ahooks 大部分 DOM 类 Hooks 都会接收 target 参数，本文由V_StPv888整理发布表示要处理的元素。 'hover' : 'leaveHover'}
封装一个管理 url 状态的 hook
本文是深入浅出 ahooks 源码系列文章的第十一篇，这个系列的目标主要有以下几点： 加深对 React hooks 的理解。 学习如何抽象自定义 hooks。 本文来讲下 ahooks 中的 useUrlState。 通过 url query 来管理 state 的 Hook。 useUrlState 的特殊 在之前的架构篇中我们就提到，ahooks 这个项目是一个 monoRepo。它的项目管理是通过 lerna[1] 进行管理的。 假如将这个 hook 内置到 ahooks 中的话，可能会导致包体积变大。 另外，该 hook 是依赖于 query-string 这个 npm 包的。
使用 sort-imports 排序规则美化头部 import 代码
问题本质 当头部 import 代码过多时，它往往是这样的： import { useAntdTable, useBoolean, useRequest, useSetState } from 'ahooks 排序后是这样的： import { useAntdTable, useBoolean, useRequest, useSetState } from 'ahooks' import { Button
【第16期】前端食堂技术周刊
vite@2.7.0 发布[5] 改进 SSR 依赖处理 API 整合 默认 server.fs.strict ahooks v3.0.0 发布[6] ahooks 3.0 的目标是建设 高质量可靠的 calendar.perfplanet.com/2021/ [5]vite@2.7.0 发布: https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md [6]ahooks
