UsePrevious

use-previous hook stores the previous value of a state in a ref, it returns undefined on initial render and the previous value of a state after rerender

Usage

Code Editor
Copy
import { usePrevious } from '@erudilabs/alma'

const [value, setValue] = useState('') const previousValue = usePrevious(value)


Current value:

Previous value:

Code Editor
Copy
<>
  <TextInput
    label="Enter some text here"
    placeholder="Enter some text here"
    name="previous-demo-input"
    value={value}
    onChange={(e) => setValue(e.target.value)}
  />
  <div className="mt-4">
    <p>Current value: {value}</p>
    <p>Previous value: {previousValue}</p>
  </div>
</>

Definition

Code Editor
Copy
function usePrevious<T>(value: T): T | undefined;