জয়েন লগইন

রিয়েক্ট useLayoutEffect

🌈রিয়েক্ট useLayoutEffect কি?

📋রিয়েক্ট useLayoutEffect হলো ব্রাউজারে রেন্ডার হওয়ার আগে লেআউট-সম্পর্কিত সাইড ইফেক্ট পরিচালনা করার পদ্ধতি।

⚒️রিয়েক্ট useLayoutEffect ব্রাউজারে রেন্ডার হওয়ার আগে লেআউট-সম্পর্কিত সাইড ইফেক্ট পরিচালনা করতে ব্যবহৃত হয়।

রিয়েক্ট useLayoutEffect ব্রাউজারে রেন্ডার হওয়ার আগে লেআউট-সম্পর্কিত সাইড ইফেক্ট পরিচালনা করার উদাহরণ।

react
import {createRoot} from "react-dom/client";
import React, {useLayoutEffect, useRef, useState} from "react";

function App() {
  const box = useRef(null);
  const [width, setWidth] = useState(0);

  useLayoutEffect(() => {
    setWidth(box.current.offsetWidth);
  }, []);

  return (
    <div>
      <div ref={box}>উইথ</div>
      <p>{width}px</p>
    </div>
  );
}

createRoot(
  document.getElementById("root")
).render(<App/>);