useUpdateEffect

useUpdateEffect is a custom hook that skips side effects on the initial render, and only runs them when the dependency array changes.

Source @yamada-ui/utils

Import

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

Copied!

Usage

Editable example

const [state, setState] = useState(1)
const [updateState, setUpdateState] = useState(1)
const [flg, { toggle }] = useBoolean()

useEffect(() => {
  setState((prev) => prev + 1)
}, [flg])

useUpdateEffect(() => {
  setUpdateState((prev) => prev + 1)
}, [flg])

return (
  <>
    <Text>state changed by useEffect: {String(state)}</Text>
    <Text>state changed by useUpdateEffect: {String(updateState)}</Text>

    <Button mt="md" onClick={toggle}>
      Update state
    </Button>
  </>
)

Copied!

Edit this page on GitHub

PrevioususeBreakpointEffect NextuseValue