Difference between a = useRef(b); and a = useRef(); a.current = b;

Hi, I've been having a problem with an async callback that I would pass to a component where any state variable called within that callback would always be its initial value instead of the current one. The solution that worked ended up being creating a ref to variables I wanted to use within that callback however if the refs were created like this

  const picturesRef = useRef(pictures);
  const filesRef = useRef(files);

  const picturesRef = useRef(pictures);
  const filesRef = useRef(files);

  const picturesRef = useRef(pictures);
  const filesRef = useRef(files);

  const picturesRef = useRef(pictures);
  const filesRef = useRef(files);

the issue would persist but once I found this other "variant" (?) on SO it did the trick

  const picturesRef = useRef<string[]>();
  picturesRef.current = pictures;

  const filesRef = useRef<File[]>();
  filesRef.current = files;

  const picturesRef = useRef<string[]>();
  picturesRef.current = pictures;

  const filesRef = useRef<File[]>();
  filesRef.current = files;

  const picturesRef = useRef<string[]>();
  picturesRef.current = pictures;

  const filesRef = useRef<File[]>();
  filesRef.current = files;

  const picturesRef = useRef<string[]>();
  picturesRef.current = pictures;

  const filesRef = useRef<File[]>();
  filesRef.current = files;

Could anyone explain to me how they're different, why the first one didn't work and if there's a better solution so I can better handle that kind of issue in the future

Neto•4/27/23, 5:15 PM

useRef keeps a reference to a element between renders

Neto•4/27/23, 5:15 PM

but when you use useRef the component itself was not rendered yet

Neto•4/27/23, 5:17 PM

when you use <Component ref={picturesRef} /><Component ref={picturesRef} /> you update the ref, making currentcurrent available

�

🥐OP•4/27/23, 5:27 PM

that makes so much more sense when you put it like that, thank you

Difference between a = useRef(b); and a = useRef(); a.current = b;

Similar Threads

Similar Threads

Similar Threads