firebase-react-hooks icon indicating copy to clipboard operation
firebase-react-hooks copied to clipboard

React Hook

Open KamusiimeRaymond opened this issue 5 years ago • 3 comments

Line 46: React Hook "useState" is called conditionally. React Hooks must be called in the exact same order in every component render.

please explain.

KamusiimeRaymond avatar Sep 17 '19 05:09 KamusiimeRaymond

Line 48: React Hook "useEffect" is called conditionally. React Hooks must be called in the exact same order in every component render

KamusiimeRaymond avatar Sep 17 '19 05:09 KamusiimeRaymond

Hey! I think you need to move this func

if (!firebase.getCurrentUsername()) { // not logged in alert('Please login first') props.history.replace('/login') return null }

after useState and useEffect, bc that return null its the actual problem.

matiaspunx avatar Mar 06 '20 20:03 matiaspunx

The rules of hooks are that it cannot be in loops, conditions, or nested functions

https://stackoverflow.com/questions/57620799/react-hook-useeffect-is-called-conditionally

const {classes} = props

const [quote, setQuote] = useState('')

useEffect(() => {
    if(firebase.getCurrentUsername()) {
        firebase.getCurrentUserQuote().then(setQuote)
    }
}, [firebase.getCurrentUsername(), firebase.getCurrentUserQuote()])

if(!firebase.getCurrentUsername()) {
    // Not logged in
    alert('Please login first')
    props.history.replace('/login')
    return null
}

fruit-ninja avatar Nov 15 '20 23:11 fruit-ninja