Почему есть бесконечный петлей в крючке с использованием? ⇐ Javascript

[Anonymous]

index.jsx < /p>

Код: Выделить всё

import React from "react";
import { startTransition, useEffect, useState } from "react";
import { createRoot } from "react-dom/client";

function App() {
const [foo, setFoo] = useState([1]);
const [bar, setBar] = useState("1");

useEffect(() => {
console.log("infinite loop")
setBar(() => {
console.log("bar");
return "2";
})
}, [foo]);

return (

 {
startTransition(() => {
setFoo((foo)=>{
console.log("transition");
return [];
});
});
setFoo((foo) => {
console.log("foo");
return [];
});
}}
>
example


);
}

createRoot(document.getElementById("container")).render();
< /code>
react version: 18.0.0 < /p>
Пример кода и пример < /p>
Нажмите кнопку «Пример» и смотрите ошибки из Log Console log
Если вы удалите Setbar 

в строке 11 или удалите StartTransition в строке 20, проблема будет решена.
и блокировать в StartTransition не будет выполнен, потому что цикл никогда не заканчивается.

Подробнее здесь: https://stackoverflow.com/questions/794 ... ffect-hook