usePrevious

usePrevious is a custom hook for obtaining the previous value.

state: false, prev: undefined

const [flg, { toggle }] = useBoolean()
const prevFlg = usePrevious(flg)

return (
  <VStack>
    <Text>
      state: {String(flg)}, prev: {String(prevFlg)}
    </Text>

    <Button onClick={toggle}>Click me to toggle the boolean value</Button>
  </VStack>
)

If you use this code, you need to add "use client" to the top of the file.

Usage

import { usePrevious } from "@yamada-ui/react"

import { usePrevious } from "@/components/ui"

import { usePrevious } from "@workspaces/ui"

const [flg, { toggle }] = useBoolean()
const prevFlg = usePrevious(flg)