Should refs be in listed as dependencies for useEffect and such?(引用是否应该列为Use Effect等的依赖项?)
问题描述
据我所知,useRef返回的容器总是相同的-但是在useEffect和类似的函数中引用它们会导致eslint穷举-deps警告。在这种情况下,忽略警告是否安全?有什么好方法可以避免用警告堵塞输出日志和用禁用行注释堵塞代码?或者我应该把它们放到依赖列表中,让埃斯林特高兴?
推荐答案
第一次调用useRef
时,它创建一个具有current
属性的对象。该对象在后续渲染中将保持不变。IE:对此对象的引用不会更改。
https://reactjs.org/docs/hooks-reference.html#useref
所以可以安全地从依赖项数组中省略它。
请参阅以下代码(也可在沙盒链接中找到):
https://codesandbox.io/s/cocky-dhawan-ys267?file=/src/App.js
const someRef = useRef({foo: "bar"});
let x = 1;
useEffect(() => {
console.log(someRef.current.foo);
console.log(x);
}, []); // THERE IS A WARNING HERE FOR THE "x"
eslint/exhaustive-deps
只担心x
,不担心someRef.current.foo
。
注意:我只是将x
放在那里,以确保警告是由eslint触发的。
背后的原因是useRef
与渲染周期无关。我的意思是,它不会重新创建,也不会在每次渲染后自动更新,就像渲染过程中创建的状态、道具或变量通常是这样。
useRef
的此警告?请查看CodeSandbox链接,并对其进行复查。检查您如何将它们引用到useEffect
中,并检查您的Reaction和Eslint/插件版本。
这篇关于引用是否应该列为Use Effect等的依赖项?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:引用是否应该列为Use Effect等的依赖项?
基础教程推荐
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01