react-navigation-v4-hooks.js

import { useEffect, useState, useContext } from 'react'
import { NavigationContext } from 'react-navigation'

export const useNavigation = () => {
  const navigation = useContext(NavigationContext)
  if (!navigation) {
    throw new Error('navigation object not found. Please make sure your component is in a navigation tree')
  }
  return navigation
}

export const useIsFocused = () => {
  const navigation = useNavigation()
  const [isFocused, setIsFocused] = useState(navigation.isFocused())

  useEffect(() => {
    const willFocus = navigation.addListener('willFocus', () => setIsFocused(true))
    const willBlur = navigation.addListener('willBlur', () => setIsFocused(false))

    return () => {
      willFocus.remove()
      willBlur.remove()
    }
  }, [navigation])

  return isFocused
}