反应：setState 没有更新数组

Question

我正在尝试使用 setState 来呈现 MenuItem 数组。这里有一些 Firebase 代码用作 MenuItems 组件的道具——本质上它查看好友请求列表并从中获取一些数据以制作 MenuItems。这是我的代码：

const getRequests = () => {
        let requestData = [];
        if (props.count <= 0) {
            return;
        }
        setMenuItem([]);
        
        auth.onAuthStateChanged(async user => {
            if (user) {
                let docRef = db.collection('users').doc(user.uid);
                await docRef.get().then((doc) => {
                    if (doc.exists) {
                        for (let i = 0; i < doc.data().requests.length; i++) {
                            requestData.unshift(<MenuItem key={i}><Request rid={doc.data().requests[i]} cid={user.uid} handleClose={handleMenuClose}></Request></MenuItem>);
                        }
                        setMenuItem(requestData);
                    }
                })  
          
            }
        })
       
    }

    useEffect(() => {
        getRequests();
    }, [])

这是我的问题：Video。每当我更改一行并保存时，我的代码都会工作，但是当我刷新页面时，数组没有填充？我认为这与状态有关，而不是重新渲染。我研究了一些与闭包和 useState 钩子相关的东西，但就是想不通。任何帮助将不胜感激！