react crash course 2024(8) useEffect

1. 引入

   import { useEffect } from 'react';

   useEffect – React 中文文档
   useEffect 是一个 React Hook，它允许你 将组件与外部系统同步。
   有些组件需要与网络、某些浏览器 API 或第三方库保持连接，当它们显示在页面上时。这些系统不受 React 控制，所以称为外部系统。
   每当你的组件渲染时，React 会先更新页面，然后再运行 useEffect 中的代码。换句话说，useEffect 会“延迟”一段代码的运行，直到渲染结果反映在页面上。

   useEffect(()=>{},[])//接收一个函数，一个依赖数组

     useEffect(() => {
       const fetchJobs = async () => {
         try {
           const res = await fetch('http://localhost:8000/jobs')
           const data = await res.json()
           setJobs(data)
         } catch (error) {
           console.log('Error fetching data', error);
         }
         finally {
           setLoading(false)
         }
       }
       fetchJobs();
     }, [])

     try {
       throw new Error("这是一个自定义错误");
   
     } catch (error) {
       console.log("捕获到运行时错误:", error.message); // 这里会执行
     }

   接收到数据后渲染html
    

   const JobPage = () => {
   //...
     return (
       loading ? <Spinner/> :(<h1>
         {job.title}
       </h1>)
     )
   }