1. useEffect 的回调参数返回的是一个清除副作用的 clean-up 函数。因此无法返回 Promise ，更无法使用 async/await

2.如何让useEffect 支持 async/await

2.1、方法一（推荐）：useEffect中异步函数采用IIFE写法（ Immediately Invoked Function Expression即立即调用的函数式表达式）

const MyFunctionnalComponent: React.FC = props => {
  useEffect(() => {
    // Using an IIFE
    (async function anyNameFunction() {
      await loadContent();
    })();
  }, []);
  return <div></div>;
2.2方法二：此时可以选择再包装一层 async 函数，置于 useEffect 的回调函数中，变相使用 async/await
 
const fetchMyAPI =async()=> {
  let response = await fetch('api/data')
  response = await res.json()
  dataSet(response)
useEffect(() => {
  fetchMyAPI();
}, []);
 
2.3方法三：在内部创建一个异步函数，等待getData(1)结果，然后调用setData():
 
useEffect(() => {
  const fetchMyAPI = async () =>{
      const data = await getData(1);
      setData(data)
  fetchMyAPI();
}, []);
 
                    1. useEffect的回调参数返回的是一个清除副作用的clean-up函数。因此无法返回Promise，更无法使用async/await2.如何让useEffect支持async/await2.1、方法一（推荐）：useEffect中异步函数采用IIFE写法（Immediately Invoked Function Expression即立即调用的函数式表达式）const MyFunctionnalComponent: React.FC = props =&gt; {  us...
1. 问题叙述
在使用antd/G2图表更新的时候发现：在useEffect中通过异步函数对图表渲染的data进行更新, 但是由于第一次更新后,数据是延迟更新的,所以好像数据并没有实时进行更新.
2. 代码分析
定义了一个heatmapData
  const [heatMapData, setHeatMapData] = useState...
				
useEffect中怎么使用async/await
1、useEffect中的第一个回调参数返回的是一个clean-up函数，所以不能返回promise对象，更不能直接使用async/await，否则会报错；
2、可以在回调参数中使用async/await：
方法一：使用自执行函数
useEffect(()=>{
	// 使用自执行函数 IIFE
	（async function fn(){
		await otherFn();
},[])
方法二：在useEffect的回调参数内部定义
git clone https://gitlab.com/mjbrown/nextjs-react-hooks-example.git
cd nextjs-react-hooks-example
npm install
npm run build
npm run start
npm run stop
启动后，可以通过Web浏览器访问位于http:
import React from "react" ;
import { render } from "react-dom" ;
import { createTrelaContext } from "trela" ;
const apis = {
  fetchUser : async ( ) => {
    const ref = await fetch ( "__YOUR_API_URL__" ) ;
    const json = await ref . json ( ) ;
    return json ;
				
乍一看，你可能会想到类似的事情，例如从远程API获取内容。
const MyFunctionnalComponent: React.FC = props => {
  useEffect(async () => {
    await loadContent();
  }, []);
  return <div></div>;
会出现什么问题？
				
轻松处理承诺。
React组件和钩子用于声明式承诺解析和数据获取。
利用Render Props模式和Hooks来获得最大的灵活性以及新的Context API Handle承诺。
React组件和钩子用于声明式承诺解析和数据获取。
无需假设数据的形状或请求的类型，就可以轻松处理异步过程的每个状态。
与获取，Axios或其他数据获取库（甚至GraphQL）一起使用。
零依赖关系可用于promise，async / await和Fetch API现在具有实验性的暂挂支持在Render Props，Co