/hooks/useUpdateEffect.ts
import { useEffect, useRef, DependencyList, EffectCallback } from "react"
const useUpdateEffect = (
effect: EffectCallback,
dependencies?: DependencyList
) => {
const isInitialMount = useRef<boolean>(true)
useEffect(() => {
if (isInitialMount.current) {
isInitialMount.current = false
} else {
return effect()
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, dependencies)
}
export default useUpdateEffect
/*
* useUpdateEffect
* (指定の変数 input 変更時)(アンマウント時)に実行
*/
useUpdateEffect(() => {
// 実行したい処理
return () => {
// クリーンアップの処理
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [input])