在看的小朋友,新的react hook寫法,官方默認setState方法移除了回調函數,推薦使用useEffect,但是改動的數據過多還是有很多問題。so,我在useState基礎上擴展了回調函數功能,就可以像以前類寫法一樣傳遞回調方法啦。
話不多說上代碼
import {useEffect, useState, useRef} from "react"; function useCallbackState (od) { const cbRef = useRef(); const [data, setData] = useState(od); useEffect(() => { cbRef.current && cbRef.current(data); }, [data]); return [data, function (d, callback) { cbRef.current = callback; setData(d); }]; } export {useCallbackState};
使用的時候像平常一樣, 回調函數可以傳可以不傳遞
const [data,setData] = useCallbackState({}); setData({}, function (data) { console.log("啦啦啦,我是回調方法", data); })