一个简单的方法是创建一个let，在你的组件中并设置为true。

然后说，如果它为真，将其设置为假，然后返回(停止)useEffect函数

像这样:

    import { useEffect} from 'react';
    //your let must be out of component to avoid re-evaluation 
    
    let isFirst = true
    
    function App() {
      useEffect(() => {
          if(isFirst){
            isFirst = false
            return
          }
    
        //your code that don't want to execute at first time
      },[])
      return (
        <div>
            <p>its simple huh...</p>
        </div>
      );
    }

它类似于@Carmine Tambasciabs解决方案，但没有使用状态:) ‍‍‍‍‍‍ ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

一个简单的方法是创建一个let，在你的组件中并设置为true。

然后说，如果它为真，将其设置为假，然后返回(停止)useEffect函数

像这样:

    import { useEffect} from 'react';
    //your let must be out of component to avoid re-evaluation 
    
    let isFirst = true
    
    function App() {
      useEffect(() => {
          if(isFirst){
            isFirst = false
            return
          }
    
        //your code that don't want to execute at first time
      },[])
      return (
        <div>
            <p>its simple huh...</p>
        </div>
      );
    }

它类似于@Carmine Tambasciabs解决方案，但没有使用状态:) ‍‍‍‍‍‍ ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

@MehdiDehghani，你的解决方案工作得非常好，你必须做的一件事是卸载，重置didMount。当前值为false。当你试图在其他地方使用这个自定义钩子时，你不会得到缓存值。

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

const useDidMountEffect = (func, deps) => {
    const didMount = useRef(false);

    useEffect(() => {
        let unmount;
        if (didMount.current) unmount = func();
        else didMount.current = true;

        return () => {
            didMount.current = false;
            unmount && unmount();
        }
    }, deps);
}

export default useDidMountEffect;

前面所有的都很好，但是这可以通过一种更简单的方式实现，考虑到useEffect中的操作可以被“跳过”，放置一个基本上不是第一次运行的if条件(或任何其他条件)，并且仍然具有依赖。

例如，我有一个案例:

从API加载数据但我的标题必须是“Loading”直到日期不存在，所以我有一个数组，开始时为空，并显示文本“显示” 使用来自这些API的不同信息来呈现组件。 用户可以一个一个删除这些信息，甚至所有使tour数组再次为空，作为开始，但这一次API获取已经完成 一旦旅游列表是空的删除，然后显示另一个标题。

所以我的“解决方案”是创建另一个useState来创建一个布尔值，该值仅在数据获取后更改，使useEffect中的另一个条件为真，以便运行另一个也依赖于巡回长度的函数。

useEffect(() => {
  if (isTitle) {
    changeTitle(newTitle)
  }else{
    isSetTitle(true)
  }
}, [tours])

这是我的App.js

import React, { useState, useEffect } from 'react'
import Loading from './Loading'
import Tours from './Tours'

const url = 'API url'

let newTours

function App() {
  const [loading, setLoading ] = useState(true)
  const [tours, setTours] = useState([])
  const [isTitle, isSetTitle] = useState(false)
  const [title, setTitle] = useState("Our Tours")

  const newTitle = "Tours are empty"

  const removeTours = (id) => {
    newTours = tours.filter(tour => ( tour.id !== id))

    return setTours(newTours)
  }

  const changeTitle = (title) =>{
    if(tours.length === 0 && loading === false){
      setTitle(title)
    }
  }

const fetchTours = async () => {
  setLoading(true)

  try {
    const response = await fetch(url)
    const tours = await response.json()
    setLoading(false)
    setTours(tours)
  }catch(error) {
    setLoading(false)
    console.log(error)
  }  
}


useEffect(()=>{
  fetchTours()
},[])

useEffect(() => {
  if (isTitle) {
    changeTitle(newTitle)
  }else{
    isSetTitle(true)
  }
}, [tours])


if(loading){
  return (
    <main>
      <Loading />
    </main>
  )  
}else{
  return ( 

    <main>
      <Tours tours={tours} title={title} changeTitle={changeTitle}           
removeTours={removeTours} />
    </main>
  )  
 }
}



export default App

    const [dojob, setDojob] = useState(false);

    yourfunction(){
        setDojob(true);
    }

    useEffect(()=>{
        if(dojob){
            yourfunction();
            setDojob(false);
        }
    },[dojob]);

你可以把它变成自定义钩子，像这样:

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

const useDidMountEffect = (func, deps) => {
    const didMount = useRef(false);

    useEffect(() => {
        if (didMount.current) func();
        else didMount.current = true;
    }, deps);
}

export default useDidMountEffect;

使用的例子:

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

import useDidMountEffect from '../path/to/useDidMountEffect';

const MyComponent = (props) => {    
    const [state, setState] = useState({
        key: false
    });    

    useEffect(() => {
        // you know what is this, don't you?
    }, []);

    useDidMountEffect(() => {
        // react please run me if 'key' changes, but not on initial render
    }, [state.key]);    

    return (
        <div>
             ...
        </div>
    );
}
// ...