React Hook "useEffect" is called conditionally

19 浏览
0 Comments

React Hook "useEffect" is called conditionally

React对下面的代码报错，称useEffect被有条件地调用了：

import React, { useEffect, useState } from 'react'
import VerifiedUserOutlined from '@material-ui/icons/VerifiedUserOutlined'
import withStyles from '@material-ui/core/styles/withStyles'
import firebase from '../firebase'
import { withRouter } from 'react-router-dom'
function Dashboard(props) {
  const { classes } = props
  const [quote, setQuote] = useState('')
    if(!firebase.getCurrentUsername()) {
        // not logged in
        alert('Please login first')
        props.history.replace('/login')
        return null
    }
    useEffect(() => {
        firebase.getCurrentUserQuote().then(setQuote)
    })
    return (
        

            // some code here
        

    )
    async function logout() {
        await firebase.logout()
        props.history.push('/')
    }
}
export default withRouter(withStyles(styles)(Dashboard))

返回的错误信息如下：

React Hook "useEffect" is called conditionally. React Hooks

must be called in the exact same order in every component render.

有人知道这里的问题是什么吗？

0