import React, { useState, useEffect, useRef } from "react";
import ReactDOM from "react-dom";
function Counter() {
const [count, setCount] = useState(0);
const savedCallback = useRef();
function callback() {
setCount(count + 1);
}
useEffect(() => {
savedCallback.current = () => {
setCount(count + 1);
};
});
useEffect(() => {
let id = setInterval(() => {
savedCallback.current()
}, 1000); // this line is critical
return () => clearInterval(id);
}, []);
return {count};
}
const rootElement = document.getElementById("root");
ReactDOM.render(, rootElement);
< /code>
Однако после того, как я изменяю критическую строку на < /p>
let id = setInterval(savedCallback.current, 1000);
< /code>
Код не будет работать. Интересно, в чем разница между savedcallback.current
Недавно я читаю статью, связанную с использованием interval , этот код работает нормально: [code]import React, { useState, useEffect, useRef } from "react"; import ReactDOM from "react-dom";
useEffect(() => { let id = setInterval(() => { savedCallback.current() }, 1000); // this line is critical return () => clearInterval(id); }, []);
return {count}; }
const rootElement = document.getElementById("root"); ReactDOM.render(, rootElement); < /code> Однако после того, как я изменяю критическую строку на < /p> let id = setInterval(savedCallback.current, 1000); < /code> Код не будет работать. Интересно, в чем разница между savedcallback.current [/code] и () => {savedcallback.current ()} ?