import { useContext, useEffect, useState } from 'react';
const Log = () => {
useEffect(() => {
console.log('Running ...')
},[])
return(<p>here</p>)
}
export default Log;
无论何时运行此代码,我都会在浏览器控制台中收到两次**Running...**消息。
我认为它应该运行一次,因为我在useEffect中有一个空的second参数。
有谁能解释一下为什么要运行两次吗?
4条答案
按热度按时间tv6aics11#
这是由于< StrictMode >最有可能在你的根树。
什么是严格模式?
StrictMode是一个用于突出显示应用程序中潜在问题的工具。
如何使
useEffect()
运行两次?它会为其子对象激活附加检查和警告,换句话说...渲染两次。
Note:
严格模式检查仅在开发模式下运行;它们不影响生产构建。rjee0c152#
如果useEffect没有任何依赖项,则组件本身仅被调用一次。
这个答案会对你有帮助。
React Hooks: useEffect() is called twice even if an empty array is used as an argument
ssm49v7z3#
由于useEffect()的依赖项列表设置为空,因此每当重新呈现Log组件时,“console.log”将自动运行。
我认为组件树中的上下文或父组件可能有一些变化。
请检查您的项目结构。
nfeuvbwi4#
只需从
src/index.js
中删除<React.StrictMode>
Package