如何在 Chakra UI 中触发关闭模式？

Question

我在 Chakra UI 中使用模态组件来显示输入编辑器 post（输入编辑器是由模态组件包裹的子组件）。如果成功获取数据，我想从输入编辑器组件触发关闭模式。

这是我的模态组件：

//...import component from Chakra Modal
import {Post as PostModal} from '../components/Modal'

export const Post = () => {

  const { isOpen, onOpen, onClose } = useDisclosure()

  return (
    <div>
  <Modal onClose={onClose} size='full' isOpen={isOpen} trapFocus={false} >
    <ModalOverlay />
    <ModalContent>
      <ModalHeader>Add Post</ModalHeader>
      <ModalCloseButton />
      <ModalBody>
        <div>
          <PostModal />
        </div>
      </ModalBody>
    </ModalContent>
  </Modal>
    </div>
  )
}

我的代码句柄提取器 post 数据：

/components/Modal

const fetcher = async (data) => {
  const _ = await sendPost(data);
  if (_) {
    //here i want to trigger close modal
  }
}

const PostInput = () => {
  return (
    //<Input/>
    //<Textarea> etc...
  )
}

谁能帮帮我？

Answer 1

一旦API调用成功就可以调用onClose函数，如：

const fetcher = async (data) => {
  let res = await sendPost(data);
  if (res.data) {
    onClose()
  }
}

如何在 Chakra UI 中触发关闭模式？

How to trigger close modal in Chakra UI?

reactjs

chakra-ui