为什么useEffect会被调用两次？

Question

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

const Log =  ()  =>  {
    useEffect(()  => {
        console.log('Running ...')
    },[])

    return(<p>here</p>)

}

export default Log;

每当这段代码运行时，我在浏览器控制台中会收到Running...消息两次。

我认为它应该只运行一次，因为我在useEffect中有一个空的第二个参数。

有人能解释为什么它会运行两次吗？

Answer 1

这是由于<StrictMode> 可能在您的根树中。

什么是严格模式？

它是如何导致 useEffect() 运行两次的？

注意： 严格模式的检查仅在开发模式下运行；它们不会影响生产构建。