Function useSyncStateAndSearchParam

Util hook to keep a state variable in sync with a URL search parameter.

  • useSyncStateAndSearchParam(
        stateVar: undefined | string | number | boolean,
        updateStateVar: (val: undefined | string) => void,
        searchParamKey: string,
        searchParams: URLSearchParams,
        setSearchParams: SetURLSearchParams,
        initializedCallback: () => boolean,
    ): void

    Parameters

    • stateVar: undefined | string | number | boolean

      the state variable to sync

    • updateStateVar: (val: undefined | string) => void

      setter function to update the state variable (should be memoized with useCallback)

    • searchParamKey: string

      the key of the URL search parameter to sync with

    • searchParams: URLSearchParams

      the current URL search parameters (i.e., from useSearchParams)

    • setSearchParams: SetURLSearchParams

      function to update the URL search parameters (i.e., from useSearchParams)

    • initializedCallback: () => boolean

      function to check if the underlying state is initialized and ready to sync with URL (should be memoized with useCallback)

    Returns void

Settings

Member Visibility