My app consists of 2 Tab Navigators and a Drawer Navigator and a Stack Navigator, I want to unmount every screen if it's not open. Since I have many navigators, things got a bit complex. I found this solution on a blog online, can it be applicable and efficient with all the screens in each navigator?
import React, { useState, useCallback } from 'react'
import { useFocusEffect } from '@react-navigation/native'
export default function Live() {
const [isVisible, setIsVisible] = useState(false)
useFocusEffect(
useCallback(() => {
setIsVisible(true)
return () => {
setIsVisible(false)
}
}, [])
)
return (
<>
{isVisible &&
<>
{/* Your component goes here */}
</>
}
</>
)
}