usePrevious

usePreviousは、直前の値を取得するカスタムフックです。

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>
)

こちらのコードを使用する場合は、"use client"をファイルの上部に追加する必要があります。

使い方

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

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

import { usePrevious } from "@workspaces/ui"

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