Различия

Показаны различия между двумя версиями страницы.

--- xuk_useref [2024/03/28 19:25]
tro создано
+++ xuk_useref [2024/03/28 19:25] (текущий)
tro
@@ Строка 8: / Строка 8: @@
 <code>
-import { useRef } from "react";
+import { useEffect, useRef } from "react";
 const App = () => {
-  const btnRef = useRef();
+  const valueRef = useRef(0);
-  return <button ref={btnRef}>Button with ref</button>;
+  useEffect(() => {
-};
+		// Виконається лише один раз під час монтування.
+		// Наступні оновлення значення рефа не
+		// викличуть оновлення компонента
+    console.log(valueRef.current);
+  });
+  const handleClick = () => {
+    valueRef.current += 1;
+  };
+  return <button onClick={handleClick}>Click to update ref value</button>;
+};
 </code>