জয়েন লগইন

রিয়েক্ট useSyncExternalStore

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

📋রিয়েক্ট useSyncExternalStore হলো এক্সটার্নাল স্টোরের সঙ্গে সাবস্ক্রিপশন ও স্টেট সিঙ্ক্রোনাইজ করার পদ্ধতি।

⚒️রিয়েক্ট useSyncExternalStore এক্সটার্নাল স্টোরের সঙ্গে সাবস্ক্রিপশন ও স্টেট সিঙ্ক্রোনাইজ করতে ব্যবহৃত হয়।

রিয়েক্ট useSyncExternalStore এক্সটার্নাল স্টোরের সঙ্গে সাবস্ক্রিপশন ও স্টেট সিঙ্ক্রোনাইজ করার উদাহরণ।

react
import {createRoot} from "react-dom/client";
import React, {useSyncExternalStore} from "react";

const store = {
  value: 0,
  listeners: new Set(),
  subscribe(listener) {
    this.listeners.add(listener);
    return () => this.listeners.delete(listener);
  },
  getSnapshot() {
    return this.value;
  },
  increment() {
    this.value++;
    this.listeners.forEach(listener => listener());
  }
};

function App() {
  const value = useSyncExternalStore(
    store.subscribe.bind(store),
    store.getSnapshot.bind(store)
  );

  return (
    <div>
      <button onClick={() => store.increment()}>বৃদ্ধি</button>
      <p>ভ্যালু: {value}</p>
    </div>
  );
}

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