Custom hook to safely set state and avoid memory leaks

Doyin Atobaru answered on January 21, 2025 Popularity 8/10 Helpfulness 1/10

answer Custom hook to safely set state and avoid memory leaks

related mmkv zustand

Custom hook to safely set state and avoid memory leaks

Comment

// Custom hook to safely set state and avoid memory leaks
function useSafeState<S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>] {
    const [state, setState] = useState<S>(initialState)
    const mountedRef = useRef<boolean>(true)

    useEffect(() => {
        return () => {
            mountedRef.current = false
        }
    }, [])

    const safeSetState = useCallback((newState: SetStateAction<S>) => {
        if (mountedRef.current) {
            setState(newState)
        }
    }, [])

    return [state, safeSetState]
}


const [isSubmitting, setIsSubmitting] = useSafeState(false)

Popularity 8/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: hook javascript memory-leaks set state

Link to this answer
Share Copy Link

Contributed on Jan 22 2025

Doyin Atobaru

0 Answers Avg Quality 2/10

Closely Related Answers

mmkv zustand

Comment

import { StateStorage } from 'zustand/middleware'
import { MMKV } from 'react-native-mmkv'

const storage = new MMKV()

const zustandStorage: StateStorage = {
  setItem: (name, value) => {
    return storage.set(name, value)
  },
  getItem: (name) => {
    const value = storage.getString(name)
    return value ?? null
  },
  removeItem: (name) => {
    return storage.delete(name)
  },
}

Popularity 5/10 Helpfulness 1/10 Language whatever

Source: github.com

Tags: zustand whatever

Link to this answer
Share Copy Link

Contributed on Jan 21 2025

himanshu verma

0 Answers Avg Quality 2/10

Custom hook to safely set state and avoid memory leaks

Contents

More Related Answers

Custom hook to safely set state and avoid memory leaks

Closely Related Answers

mmkv zustand

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.