javascript - 使用useEffect Hook 时,如何避免多余的React组件渲染?

标签 javascript reactjs react-redux electron

大家,我目前正在从事React/Electron项目,并且对如何满足客户使用useEffect Hook 时减少渲染次数的要求感到困惑。在当前项目中,我使用的是容器/组件结构,所以我有index.js文件,其中包含组件的所有逻辑以及所涉及的useEffect。如果文件存在,index.js中的useEffect旨在预填充文件输入,但是,这是引起额外渲染的原因,因为该组件在useEffect完成之前渲染,而一旦完成,则home组件然后再次使用更新后的数据重新渲染。所以我的问题是有没有办法在home组件第一次渲染之前完成useEffect,或者这只是React的一部分,不能真正更改,我的客户将不得不接受?
enter image description here

最佳答案

useEffect(() => {}, [])
末尾为空数组意味着此useEffect没有任何dep,因此它将仅在开始时运行一次。
ref:https://reactjs.org/docs/hooks-reference.html#useeffect(以下为黄色)

关于javascript - 使用useEffect Hook 时,如何避免多余的React组件渲染?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62598139/

相关文章:

javascript - 如果存在则使用值,否则使用 or 运算符分配默认值

javascript - transcrypt 中的可迭代仿真

javascript - 将表情符号添加到输入

javascript - React Redux - 从简单操作中调用函数会导致 "not a function"错误

javascript - 被卡住加载 react 故事书

javascript - 拦截 switch default 或 case 中抛出的错误时的不同行为(React/Redux)

javascript - 更新 vue 组件数据中的数组

javascript - asbygoogle 导致 chrome 执行脚本永远不会返回

html - 单击时隐藏 div 并显示另一个 div?

reactjs - React SetState 不调用 render