個人中心PERSONAL CENTER
本文不會過多講解基礎知識，更多說的是在使用useRef如何能擺脫 這個 閉包陷阱 ？ react hooks 的閉包陷阱 基本每個開發員都有遇見，這是很令人抓狂的。 (以下react示范demo，均為react 16.8.3 版本) 列一個具體的場景： functi...
現在就是要求在小程序下面商品左右滑動上面tab也跟隨變動功能 點擊tab切換下面的上面信息，商品左右滑動切換上面的tab分類 功能描述：點擊tab切換下面的商品信息；滑動下面的商品信息tab也進行切換。 第一步：我們先來說一下上面的tab,tab我們使...
陷進到處都是啊！本篇文章就說說Hooks使用時存在所謂的閉包陷阱，看看下面代碼： functionChat(){ const[text,setText]=useState(''); constonClick=useCallback(()=>&n...
在項目開發中，要求可以實現客戶多次提交，這樣的要求如何實現？ 實現方法很多，比如添加 loading，在第一次點擊之后就無法再次點擊。另外一種方法就是給請求異步函數添加上一個靜態鎖，防止并發產生。這就是 ahooks 的 useLockFn 做的事情。 useLo...
本篇主要和大家溝通關于ahooks ，我們可以理解為加深對 React hooks 的了解。 我們先說下關于抽象自定義 hooks。構建屬于自己的 React hooks 工具庫。 其實我們應該培養閱讀學習源碼的習慣，工具庫是一個對源碼閱讀不錯的選擇。 注：本系列對 ah...
我們今天來講講關于ahooks 源碼，我們目標主要有以下幾點： 深入了解 React hooks。 明白如何抽象自定義 hooks，且可以構建屬于自己的 React hooks 工具庫。 小建議：培養閱讀學習源碼的習慣，工具庫是一個對源碼閱讀不錯的選擇。 列表頁常見...
在項目中，要求微信小程序的地區可以選擇偽五級聯動 展示如下 這里采用的是自定義多列選擇器picker mode="multiSelector" <viewclass="section"> <viewclass="section__title">多列選擇器</view> <pick...
起因 社會在不斷的向前，技術也在不斷的完善進步。從 React Hooks 正式發布到現在，越來越多的項目正在使用 Function Component 替代 Class Component，Hooks 這一新特性也逐漸被廣泛的使用。 這樣的解析是不是很熟悉，在...
JavaScript異步與回調 一、前言 首先我們要記住的是異步和并行有著本質的區別。 并行，簡單來說是一般指并行計算，就是說同一時刻有多條指令同時被執行，這些指令可能執行于同一CPU的多核上，或者多個CPU上,或者多個物理主機甚至多個網絡中。 ...
這是講 ahooks 源碼的第一篇文章，簡要就是以下幾點： 加深對 React hooks 的理解。 學習如何抽象自定義 hooks。構建屬于自己的 React hooks 工具庫。 培養閱讀學習源碼的習慣，工具庫是一個對源碼閱讀不錯的選擇。 注：本系列對 ahooks 的源碼...
最近嘗試在 useEffect 使用 async 的時候會報錯，因此，本篇文章就是想喝大家說說為什么？也解讀其中緣由。 具體代碼分析 執行 mountEffect 當頁面中使用 useEffect 的時候，會在初始化的時候執行 mountEffect 如下： useEffect:functi...
在項目搭建過程中吃，需要實現一個多列選擇器，在用戶確定之前，無論列表如何轉，對于已選擇的都不會有影響，只有在確定選擇內容后才顯示值上。 思路：保存兩份，一份用來存放用戶選擇的中間值，當用戶點擊確定時，把中間值更新為已確認值。如果用戶選...
背景 在使用useEffect中用啦回調函數中使用 async...await... 這時候就會報錯。 上面代碼可以看到，在報錯，effect function 應該返回一個銷毀函數（effect：是指return返回的cleanup函數），如果 useEffect 第一個參數傳入...
useEffect是很常見的，現在寫的是十分需求的。 useEffect(async()=>{ awaitgetPoiInfo();//請求數據 },[]); 可是React 卻無法支持這樣做，就是因為 effect function 應該返回一個銷毀函數（effect：是指return返回的cleanup函...
很多知識就是在開發中讓我們更加努力學習，本篇文章主要就是講在微信小程序中實現多項選擇器checkbox。 第一的話就是我們的相關的布局文件： <viewclass="container"> <viewclass="page-body"> <viewclass="page-section...
