React Native Modalfy
v3.x
v3.x
  • Getting started
  • Installation
  • ๐Ÿค“Guides
    • Creating a stack
    • Opening & closing
    • Passing params
    • Triggering a callback
    • Type checking with TypeScript
    • Subscribing to events
    • Using outside React
    • Upgrading from v2.x
  • ๐Ÿ“šAPI Reference
    • Types
      • ModalStackConfig
      • ModalOptions
      • ModalProp
      • ModalComponentProp
      • ModalProps
      • ModalComponentWithOptions
    • ModalProvider
    • createModalStack
    • useModal
    • withModal
    • modalfy
  • ๐Ÿ“ฐBlog
    • Unveiling Modalfy v3
    • Announcing Modalfy v2
    • Stacks on stacks in React Native
    • Introducing a Modal Citizen
  • ๐Ÿ—ƒ๏ธOthers
    • Help
    • Contributing
    • Changelog
    • GitHub
Powered by GitBook
On this page

Was this helpful?

  1. API Reference

useModal

PreviouscreateModalStackNextwithModal

Last updated 10 months ago

Was this helpful?

Hooks that exposes Modalfy's API. The object returned by useModal()is covered in , you can get some nice autocomplete by utilizing ModalProp.

Note: Prefer withModal() HOC if you're using a Class component.

const useModal = <P extends ModalfyParams>(): UsableModalProp<P> => {
  const context: UsableModalProp<P> = React.useContext(ModalContext)
  const { closeModal, closeModals, closeAllModals } = modalfy<P>()
  return {
    closeAllModals: closeAllModals: closeAllModals as UsableModalProp<P>['closeAllModals'],

    closeModals: closeModals as UsableModalProp<P>['closeModals'],

    closeModal: closeModal as UsableModalProp<P>['closeModal'],

    currentModal: context.currentModal,

    openModal: context.openModal,
  }
}

If you're using TypeScript and have your params types, you can get some nice autocomplete by utilizinguseModal()like this:

import { ModalStackParamsList } from 'App'
// ...
const { openModal } = useModal<ModalStackParamsList>()
๐Ÿ“š
react-native-modalfy/useModal.ts at main ยท colorfy-software/react-native-modalfyGitHub
Logo