業(yè)務(wù)場景：在父組件加載頁面的時候，獲取子組件中通過網(wǎng)絡(luò)請求獲取的值，
用到的hook:useEffect()、useRef()。

這里是父組件

const BaseAssestsTreeContext = createContext(); 
const myRefAssetMonitor=useRef()

//父組件關(guān)鍵useEffect
  useEffect(() => {
    console.log("====父頁面，useEffect方法")
    console.log("===進來父頁面去獲取 getD()",myRefAssetMonitor.current.getD())
    setTimeout(()=>{
      if(groupId){
        queryAreaAsset(groupId);
      }else{
        console.log("===延時去獲取 子頁面的鉤子方法 myRefAssetMonitor.current.getD()",myRefAssetMonitor.current)
        queryAreaAsset(myRefAssetMonitor.current.getD());
        setGroupId(myRefAssetMonitor.current.getD())
      }
    },300)
  }, [])
 <div className={style.bg}>
        <div className={style.bg_tree}>
          <BaseAssestsTreeContext.Provider>
            <BaseAssestsTree myContext={BaseAssestsTreeContext} myRef={myRefAssetMonitor}/>
          </BaseAssestsTreeContext.Provider>
        </div>
        <div />

這里是子組件

  useEffect(() => {
    console.log("====子頁面  資產(chǎn)樹 useEffect方法")
    tree();//這里獲取網(wǎng)絡(luò)請求
  }, []);

  //想暴露給父組件的值 
  useImperativeHandle(myRef, () => ({
    getD: () => {
      return defaultGroupId;
    }
  }));

父子組件渲染順序和鉤子函數(shù)值.png