useEffect不遵守承诺并返回null

问题描述 投票:0回答:1

我尝试在组件首次加载时使用Effect。 UseEffect调用了firebase函数,但返回的是null,我不知道为什么。

     const [emails, setEmails] = useState({
        reports: [],
        savedReports: [],
      })

        useEffect(() => {
    props.firebase.getEmailReportsTo(props.orgId)
    .once('value')
    .then(returnedEmails => {
      console.log(returnedEmails.val());
      setEmails(prevEmails => ({
        ...prevEmails,
        savedReports: [returnedEmails.val()]
      }))
    })
  }, []);

这里我调用了一个返回值的firebase方法。我已经确认该端点中存在值。上面返回null。在调用完成之前,好像控制台日志正在记录。但是我不知道为什么,因为console.log在then中。 Console.log不是重要的部分,但在我的状态下也会创建null。

当我这样做时:

 useEffect(() => {
    props.firebase.getEmailReportsTo(props.orgId)
    .once('value')
    .then(returnedEmails => {
      console.log(returnedEmails.val());
      setEmails(prevEmails => ({
        ...prevEmails,
        savedReports: [returnedEmails.val()]
      }))
    })
  }, [emails.savedReports]);

我可以查看带有数据的console.log,但这会陷入无限循环。将[emails.savedReports]更改为[emails]也会返回null

这可以分为两个问题,但是无论如何帮助我实现将状态设置为Firebase调用的结果对我来说都是有效的。一个可能是为什么useEffect不等待然后完成?另一个可能是如果[emails.savedReports已更新,那么它不应该停止执行useEffect吗?但是我可以解决,这对我来说很酷。

reactjs
1个回答
0
投票

您在获取props.orgId时正在发出请求

useEffect(() => {
  if(props.orgId){ // if you receive your orgId then an then your request will be call
    props.firebase.getEmailReportsTo(props.orgId)
    .once('value')
    .then(returnedEmails => {
      console.log(returnedEmails.val());
      setEmails(prevEmails => ({
        ...prevEmails,
        savedReports: [returnedEmails.val()]
      }))
    })
   }
  }, [props.orgId]); 
热门问题
推荐问题
最新问题