无效的 useAuthState() 钩子调用

如何解决无效的 useAuthState() 钩子调用

我正在创建一个具有用户对象的社交媒体应用程序。所以，我定义了我的 firebase 配置并初始化了它。我想创建仪表板组件，但有一个名为 Invalid hook call 的错误。

组件/Dashboard.js

import firebase from 'firebase/app';
import 'firebase/firestore';
import 'firebase/auth';
import { useAuthState } from 'react-firebase-hooks/auth';

function Dashboard(props){
    const auth = firebase.auth()
    const [user] = useAuthState(auth);

    return (
        <div>
            {user.displayName}
        </div>
    )
}

export default Dashboard