Leave Yamada UI a star

Star
Yamada UIYamada UIv1.5.0

useBoolean

useBoolean is a custom hook used to manage boolean values using on, off, and toggle functions.

Source@yamada-ui/use-boolean

Import

import { useBoolean } from "@yamada-ui/react"
Copied!

Usage

Editable example

const [flg, { on, off, toggle }] = useBoolean()

return (
  <>
    <Text>state: {String(flg)}</Text>

    <Wrap mt="md" gap="md">
      <Button onClick={on}>On</Button>
      <Button onClick={off}>Off</Button>
      <Button onClick={toggle}>Toggle</Button>
    </Wrap>
  </>
)
Copied!

Using Initial Values

Editable example

const [flg, { on, off, toggle }] = useBoolean(true)

return (
  <>
    <Text>state: {String(flg)}</Text>

    <Wrap mt="md" gap="md">
      <Button onClick={on}>On</Button>
      <Button onClick={off}>Off</Button>
      <Button onClick={toggle}>Toggle</Button>
    </Wrap>
  </>
)
Copied!

Edit this page on GitHub

PrevioususeAsyncNextuseBreakpoint