use-last-ref

Constantly updating ref value from the argument

Install

npm install --save use-last-ref

Usage

import * as React from 'react'
import api from "./api"

import useLastRef from 'use-last-ref'
// Or: import { useLastRef } from 'use-last-ref'

const ExampleInput = ({ value }: { value?: string }) => {
  const valueRef = useLastRef(value)

  const save = React.useCallback((newValue: string) => {
    // Instead of adding `[value]` to `useCallback` dependency list
    // and updating `save` function and `<CustomSelect>` component
    // we use React reference feature to always access updated value

    // Prevent submitting the save value
    if (newValue !== valueRef.current) {
      api.saveNewValue(newValue)
    }
  }, [])

  return <CustomSelect onSelect={save} />
}

License

MIT © termosa

This hook is created using create-react-hook.