Yamada UIにスターをあげる

スター
Yamada UIYamada UIv1.7.2

usePromiseDisclosure

usePromiseDisclosureは、一般的な開閉や切り替えのシナリオを非同期処理するのに役立つカスタムフックです。ModalDialogDrawerなどのコンポーネントを制御するために使用できます。

ソース@yamada-ui/use-disclosure

インポート

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

使い方

編集可能な例

const { isOpen, onClose, onOpen, onSuccess } = usePromiseDisclosure()

const onClick = async () => {
  try {
    // Subsequent processing will be blocked until `onSuccess` is executed.
    await onOpen()

    console.log("あるじゃねえか、サタン!!!")
    console.log("おめえはホントに世界の…")
    console.log("救世主かもな!!!!")
  } catch {
    console.error("地球は滅亡しました")
  }
}

return (
  <VStack alignItems="start">
    <Text>だ…大地よ海よ そして生きているすべての みんな…</Text>
    <Text>このオラにほんのちょっとずつだけ元気をわけてくれ…!!!</Text>

    <Button onClick={onClick}>わけない</Button>

    <Dialog
      size="2xl"
      cancel="わけない"
      header="ミスター・サタン"
      isOpen={isOpen}
      success="わける"
      onCancel={onClose}
      onClose={onClose}
      onSuccess={onSuccess}
    >
      <Text>き、きさまらいいかげんにしろーーーっ!!!</Text>
      <Text>さっさと協力しないかーーーっ!!!</Text>
      <Text>
        このミスター・サタンさまのたのみも、きけんというのかーーーっ!!!
      </Text>
    </Dialog>
  </VStack>
)
Copied!

GitHubでこのページを編集する

useProcessinguseResizeObserver