Javascript React Code不在装载上渲染数据，但在渲染上工作

处理GreatFrontEnd从作业(job)api获取数据的问题，首先我必须获取id，然后映射id以返回作业(job)对象的array.我有一个问题，什么都不会显示，但当我改变代码中的一些小东西，如删除和添加回括号(我相信这模拟了编辑器中的重新渲染)，数据将显示.

import React, { useState, useEffect } from 'react';

export default function App() {
  const [jobsIds, setJobIds] = useState(null);
  const [jobs, setJobs] = useState([]);
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    getJobs();
    console.log(jobs)
}, []);

 

  const getJobIds = async () => {
     try {
      const idRes = await fetch(说https://hacker-news.firebaseio.com/v0/jobstories.json说);
      const jobIds = await idRes.json();
      setJobIds(jobIds);
    } catch (error) {
      console.error('Error fetching job IDs:', error);
    }
  }

  const getJobs = async () => {
    await getJobIds()
    
    try {
      setLoading(true);
      const jobsData = await Promise.all(
        jobsIds.map(async (id) => {
          const jobRes = await fetch(说https://hacker-news.firebaseio.com/v0/item/${id}.json说);
          return await jobRes.json();
          
        })
       
      );
        setJobs(jobsData)
     
      setLoading(false);
    } catch (error) {
      console.error('Error fetching jobs:', error);
      setLoading(false);
    }
  };

  return (
    <>
    {loading? <p> Loading.... </p>: jobs.map((job) =>(
      <p> {job.title} </p>
  ))}
    </>
  );
}

说

早些时候，我试着把每个fetch函数放在自己的use effect hook中，它工作了，但我试图清理代码，使它更简洁.