在使用效果中使用Ref Vs Ref. -Current有什么区别？

Question

我有以下参考变量：

const renderRefs = useRef()

之间的差异是什么：

  useEffect(() => {
   
  }, [renderRefs.current])

两者

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

Answer 1

假设您打算参考相同的参考 -

useref返回的REF对象是稳定的。它不会在重新订阅者之间发生变化。由于始终是相同的，所以这

useEffect(() => {

}, [refItem])

等同于

useEffect(() => {

}, [])

.current ref的属性中的任何内容都可能会在重新订阅中进行更改，具体取决于REF的使用方式。将.current属性放在依赖项数组中的意思是：“在重新渲染后，如果值自先前渲染以来已更改，请运行效果回调。”

例如，如果您有

<button
  onClick={() => {
    refItem.current = 5;
    setSomeState('abc');
  }}
  ...

单击按钮，则由于setSomestate而导致重新效率在依赖项数组中并运行效果回调。

如果ref值曾经在最后一个渲染上为5，则在上面的点击处理程序内进行refitem.current = 5表示效果呼叫将在下一个下一个 not 运行渲染，因为前5个值等于当前值5。

设置状态很重要。如果您不设置状态，则组件不会重新渲染，并且组件未重新渲染，则未检查依赖项数组值（也没有发生任何其他情况）。因此，仅执行

<button
  onClick={() => {
    refItem.current = 5;
  }}
  ...

不足以触发效果回调。