我在一个名为UseEffect的自定义钩子中使用UseEffect，我在两个组件中使用这个UseEffect，即（第一个，第二个），但是UseEffect只有在呈现第一个和第二个组件GET时才会调用。

例如

我有第一个组件

import React,{useState} from 'react'
import useCustomHook from './customHook'

function First(){
 console.log("component First rendering")
 const [count,setCount]=useState(0)
 useCustomHook(count)

 return (<div>First component</div>)

}

这是我的第二个组成部分

import React,{useState} from 'react'
import useCustomHook from './customHook'

function Second(){
 console.log("component Second rendering")
 const [count,setCount]=useState(0)
 useCustomHook(count)

 return (<div>Second component</div>)

}

这是我的定制钩

import {useEffect} from 'react'

function useCustomHook(count){
  console.log("useCustomHook getting called")
  useEffect(()=>{
 console.log("useEffect gets called") //this function is running after both component rendered
  },[count])

}

我的主应用程序组件

import First from './first'
import Second from './second'

function App(){
   return (
      <div>
        <First/>
        <Second/>
      </div>
    )
}

我的控制台输出是:

1）组件首次渲染

2）useCustomHook被调用

3）组件二次渲染

4）useCustomHook被调用

5）（2）调用useEffect

我想知道

为什么5行的输出不在2行之后，为什么第二组件日志发生在2行之后，因为UseEffect应该在第一组件调用UseComHook之后而在第二组件日志调用之前调用。 为什么useCustomHook中的useEffect没有在second组件日志之前被调用。