tag hooks

標籤
貢獻21
71
12:19 PM · Nov 03 ,2025
jackysummer 頭像 daishuyunshuzhanqianduan 頭像 rxliuli 頭像 zhengcaiyunqianduantuandui 頭像 joyerli 頭像 shuirongshui 頭像 xiaodaigua_ray 頭像 refanbanzhang 頭像 chengpu 頭像 machinist 頭像 kasong 頭像 longxiang_5e6f96eb722df 頭像

@hooks / 博客 RSS 訂閱

jackysummer 頭像

JackySummer - 【解讀 ahooks 源碼系列】 （開篇）如何獲取和監聽 DOM 元素

前言 由於在工作中自定義 Hook 場景寫的較多，當實現某個通用場景功能時，可能沒想過有已實現好的 Hook 封裝或者壓根沒想去從 Hooks 庫裏面找，但是社區好的實現使用起來是可以提高開發效率和減少 bug 率的。 公司項目中有依賴庫 ahooks，但我用的次數不多，於是有了想詳細瞭解 ahooks 的打算，更主要是為了更加熟練抽離與實現一些場景 Hook，學習如何更好的自定義 Hook，便有

react , hooks , 前端 , Javascript

收藏 評論

plutolam 頭像

plutoLam - react hook的最強拓展——useEffect篇

前言 隨着react16.8的發佈，hook新特性隨之而來，hook的到來讓function組件煥發出強大的能力，足矣取代之前的class組件。函數式組件依靠useState、useEffect等hook實現變量狀態維持、抽離副作用等功能。雖然原生的useEffect具有強大的功能，但是那些常用的寫法每次都要手動復現一次，不但影響開發效率，而且容易出錯。 下面我會給大家推薦一個npm第三方庫，它將

react , hooks , hook , npm , 前端

收藏 評論

changlina 頭像

長林啊 - 掌握 React Hooks：現代 React 開發的必備技能

大家好，我是長林啊！一個愛好 JavaScript、Go、Rust 的全棧開發者；致力於終身學習和技術分享。 本文首發在我的微信公眾號【長林啊】，歡迎大家關注、分享、點贊！ Hooks 是 React 官方團隊在 React 16.8 版本中正式引入的概念。通俗的講，Hooks 只是一些函數，Hooks 可以用於在函數組件中引入狀態管理和生命週期方法；如果希望讓 React 函數組件擁有狀態管理和

react , hooks , typescript , 前端 , Web

收藏 評論

zzd41 頭像

superZidan - 詳解 React 中的閉包問題

hello 大家好，我是 superZidan，這篇文章想跟大家聊聊 React 中的閉包 這個話題，如果大家遇到任何問題，歡迎 聯繫我 JavaScript 中的閉包一定是最可怕的特性之一。 即使是無所不知的 ChatGPT 也會告訴你這一點。 它也可能是最隱秘的語言概念之一。 每次編寫任何 React 代碼時，我們都會用到它，大多數時候我們甚至沒有意識到。 但最終還是無法擺脱它們：如果我們想編

react , hooks , 閉包 , Javascript

收藏 評論

chen_aaron 頭像

晚安啦 - 五個好用的Hooks

React.js 目前是前端開發人員十分流行的 JavaScript 庫。它由 Facebook 發明，但作為開源項目提供給世界各地的開發人員和企業使用。 React 真正改變了我們構建單頁面應用程序的方式，其中最大的特點之一是函數組件的應用。Hooks 是19年推出的，使我們能夠在處理狀態時使用函數組件而不是基於類的組件。除了內置的 hooks 外，React 還提供了實現自定義 hooks 的

react , hooks , 前端

收藏 評論

gkymfrg1 頭像

ohoherror - react 常用的hook

react最常用的hooks有，useState,useEffect,useMemo，useCallback 首先我們來先聊useState,設置和改變state，代替原來的state和setState import { useState } from "react"; import './index.css' export default () = { const [ count,

react , hooks , 前端

收藏 評論

jean-baptiste-jung 頭像

Jean-Baptiste Jung - 10 Useful WordPress Hook Hacks

What Is A Hook? To achieve a particular effect on a WordPress blog, you have to modify how WordPress works. Some of these modifications are made to what WordPress developers call “core files,” file

wordpress , hooks , Hacks , Techniques (WP)

收藏 評論

moon_glade 頭像

moonglade - 解讀 React useEvent RFC

談談 React 的新提案：useEvent 2022 年 5 月 5 日，Dan Abramov 在 React RFC 上提交了一個新 hook 的提案：useEvent。其目的是返回一個永遠引用不變(always-stable)的事件處理函數。 沒有 useEvent 時我們如何寫事件函數 首先我們來看一下這段代碼 function Chat() { const [text, setTe

Facebook , react , hooks , github , rfc

收藏 評論

jackysummer 頭像

JackySummer - 【解讀 ahooks 源碼系列】DOM篇（一）

前言 本文是 ahooks 源碼系列的第二篇，下面鏈接是第一篇 DOM 篇的前置講解： 【解讀 ahooks 源碼系列】（開篇）如何獲取和監聽 DOM 元素 後續的文章將會直入主題，每篇文章解讀四至六個 Hooks 源碼實現。 useEventListener 優雅的使用 addEventListener。 官方文檔 用法 import React, { useState, useRe

react , hooks , 前端 , Javascript

收藏 評論

thomasmaier 頭像

Thomas Maier - Useful Tips To Get Started With WordPress Hooks

Even though hooks in WordPress are amazing and everyone uses them knowingly or unknowingly, I get the impression that some advanced users and especially front–end developers still seem to avoid them

wordpress , hooks , Techniques

收藏 評論

jackysummer 頭像

JackySummer - 【解讀 ahooks 源碼系列】DOM篇（四）

前言 本文是 ahooks 源碼（v3.7.4）系列的第五篇，也是 DOM 篇的完結篇，往期文章： 【解讀 ahooks 源碼系列】（開篇）如何獲取和監聽 DOM 元素：useEffectWithTarget 【解讀 ahooks 源碼系列】DOM 篇（一）：useEventListener、useClickAway、useDocumentVisibility、useDrop、useDrag

react , hooks , 前端

收藏 評論

jackysummer 頭像

JackySummer - 【解讀 ahooks 源碼系列】Dev篇——useTrackedEffect 和 useWhyDidYouUpdate

前言 本文是 ahooks 源碼（v3.7.4）系列的第六篇——Dev 篇，該篇主要是協助開發調優的 Hook，只有兩個 往期文章： 【解讀 ahooks 源碼系列】（開篇）如何獲取和監聽 DOM 元素：useEffectWithTarget 【解讀 ahooks 源碼系列】DOM 篇（一）：useEventListener、useClickAway、useDocumentVisibilit

react , hooks , 前端

收藏 評論

jackysummer 頭像

JackySummer - 【解讀 ahooks 源碼系列】DOM篇（二）

前言 本文是 ahooks 源碼系列的第三篇，往期文章： 【解讀 ahooks 源碼系列】（開篇）如何獲取和監聽 DOM 元素 【解讀 ahooks 源碼系列】DOM篇（一） 本文主要解讀 useEventTarget、useExternal、useTitle、useFavicon、useFullscreen、useHover 源碼實現 useEventTarget 常見表單控件(通過 e

react , hooks , 前端 , Javascript

收藏 評論

daishuyunshuzhanqianduan 頭像

袋鼠雲數棧UED - 你應該瞭解的hooks式接口編程 - useSWR

什麼是 useSWR ? 聽名字我們都知道是一個 React 的 hooks，SWR 是stale-while-revalidate的縮寫, stale 的意思是陳舊的, revalidate 的意思是重新驗證/使重新生效, 合起來的意識可以理解成 在重新驗證的過程中先使用陳舊的，在http 請求中意味着先使用已過期的數據緩存，同時請求新的數據去刷新緩存。 這在 http 請求中Cache-Con

react , hooks , 前端

收藏 評論

daniel-pataki 頭像

Daniel Pataki - The Definitive Guide To WordPress Hooks

If you’re into WordPress development, you can’t ignore hooks for long before you have to delve into them head on. Modifying WordPress core files is a big no-no, so whenever you want to change existi

wordpress , Functions , hooks , Essentials

收藏 評論

longxiang_5e6f96eb722df 頭像

shandamengcheng - 在useEffect中執行異步請求的幾種方式

當在React中使用異步請求時，通常使用useEffect來觸發異步請求的執行，以便在組件掛載時或某些特定狀態發生變化時獲取數據。 在使用useEffect時，我們可以採用多種方式來執行異步請求，其中包括使用異步函數表達式、IIFE、Promise.then和函數聲明。但是，需要注意的是不能將async函數直接傳遞給useEffect， 如果直接把async函數傳給useEffect最為第一

react , hooks , Javascript

收藏 評論

kasong 頭像

卡頌 - useState與useReducer性能居然有區別？

大家好，我卡頌。 稍微深入瞭解過useState的同學都知道 —— useState其實是預置了reducer的useReducer。具體來講，他預置的reducer實現如下： function basicStateReducer(state, action) { // $FlowFixMe: Flow doesn't like mixed types return typeof acti

react , hooks , 前端 , Javascript

收藏 評論

machinist 頭像

machinist - hooks 中使用dva

hooks 中使用dva reacts hooks已經問世很久了今天來記錄下如何在hooks是使用dva， 眾所周知函數是不可以是不可以使用修飾符修飾的，因為函數存在變量提升問題。 所以大多數人有選擇再次掏出自己的redux，但是redux使用起來確實沒有dva方便，那麼下面就讓我們看看如何在hooks中優雅的使用dva吧！ 廢話不多説直接上代碼！ index.js import Re

hooks , dva.js

收藏 評論

jackysummer 頭像

JackySummer - 【解讀 ahooks 源碼系列】DOM篇（三）

前言 本文是 ahooks 源碼系列的第四篇，往期文章： 【解讀 ahooks 源碼系列】（開篇）如何獲取和監聽 DOM 元素：useEffectWithTarget 【解讀 ahooks 源碼系列】DOM篇（一）：useEventListener、useClickAway、useDocumentVisibility、useDrop、useDrag 【解讀 ahooks 源碼系列】DOM篇

react , hooks , 前端

收藏 評論

chengpu 頭像

BigYe程普 - 精讀React hooks（一）：useState 的幾個基礎用法和進階技巧

🎯 【專欄：精讀React Hooks】我用16篇文章詳細解讀16個React官方的Hook，每一篇都盡力做到比官方文檔更仔細且更易讀，同時提供了開源demo作為演示。如果你是新手，可以把這個專欄當作學習材料，如果你有一定經驗了，可以把這份專欄當作查缺補漏的資料。 專欄首發地址：J實驗室 - React Hooks 專欄演示地址：React Hooks Demo 加入「前端

react , hooks , 前端框架 , 前端

收藏 評論

refanbanzhang 頭像

熱飯班長 - vue pinia與vue hooks(Composition API)的關鍵差異

vue pinia的用途 用於全局狀態共享。 vue hooks(Composition API)的用途 用於邏輯封裝與複用（注意這裏沒有狀態共享）。 兩者之間關鍵差異 vue pinia是一個單例，也就是説多次初始化實例都是同一個，所以在多個組件中使用時，他們修改的時同一份數據，也就能實現vue pinia的設計目的，即數據共享。 而vue hooks則不是，每次初始化都會創建一個獨立的實例，所

vue.js , hooks , pinia , 前端

收藏 評論

xiaodaigua_ray 頭像

XiaoDaiGua_Ray - 如何基於 vue3.x 編寫自己的 hook

什麼是 hooks 函數式編程在前端開發中越來越流行，尤其是在現代前端框架 Vue3.x 和 React 16+ 中。它的優點包括代碼可讀性、可維護性、可測試性和複用性。 學習如何利用框架提供的鈎子（hooks）編寫自定義鈎子函數是非常重要的技能之一。通過編寫自定義鈎子函數，我們可以滿足特定需求，使我們的代碼更加靈活和可擴展。 掌握函數式編程和鈎子的使用，能夠提高我們的開發效率，同時提供更好的用户

hooks , 自定義 , vue3 , typescript , 前端

收藏 評論

shuirongshui 頭像

水冗水孚 - Vue3中使用hook實現按住Shift快速勾選el-table功能

需求描述 最近產品説，某個el-table要實現按住shift鍵快速勾選功能 大概就是仿windows系統的文件shift按住選中功能 反正就是儘可能多的讓用户勾選 方便用户快速勾選操作 github完整代碼：https://github.com/shuirongshuifu/vue3-echarts5-example Windows系統的功能效果圖 比如可以向前多選 或者向後多

hooks , vue3 , element-plus , hook

收藏 評論

joyerli 頭像

joyerli - react狀態總結

本文從動機脈絡聊聊對react生態中的狀態相關技術的演化過程。 個人理解，歡迎討論 響應式渲染框架 這裏只聊react的狀態和視圖渲染相關內容，不聊底層的Virtual DOM react是一個mvvm框架，作為一個響應式渲染設計，當自身的模型（狀態）發生變化時，會自動刷新(re-render)當前視圖顯示最新的模型(狀態)數據。 那是如何監聽狀態發生變化呢？react本着極簡的api設計理念，遵

react , hooks , mobx , redux

收藏 評論