Cara paling sederhana untuk membuat Shared Global States di React menggunakan model atom sederhana. Di blog ini, Anda akan menemukan rincian penggunaan dan implementasi perpustakaan.

Penggunaan

Buat negara Global Anda

import { gState } from 'usegstate'

const myGlobalState = gState('hello-world!')

import useGState from 'usegstate'

const YourAwesomeApp = () => {
  const [gState,setGState] = useGState(myGlobalState)
  return (
    <div>{gState}</div>
  )
}

import {GStateProvider} from 'usegstate'

const Wrapper = () => {
  return (
    <GStateProvider>
      <YourAwesomeApp />
    </GStateProvider>
  )
}

Mengapa tidak Bereaksi API Konteks?

Seperti yang kita ketahui, React Context me-render setiap anak setiap kali state yang dibagikan berubah di setiap komponen anak, sehingga menyebabkan rerender tambahan dan masalah kinerja dalam beberapa kasus.

Motivasi

Saya selalu ingin tahu tentang bagaimana perpustakaan pusat eksternal seperti redux , jotai , dll. bekerja. Sepertinya mereka menggunakan semacam kekuatan super yang memungkinkan mereka membuat pusat penyimpanan eksternal ini, yang benar-benar terisolasi dari aliran reaksi searah.

Dan setelah melalui kode sumber besar mereka, saya menemukan kuncinya. Satu hal yang sangat memperluas wawasan pengetahuan reaksi saya.

Ide Utama penggunaanGState — Cara kerjanya.

Fungsi penyetel status React seperti fungsi penyetel useState() atau fungsi pengiriman useReducer() dapat mengakses/memodifikasi status di luar aliran searah reaksi.

Dengan kata sederhana, kita dapat mengakses/memodifikasi status reaksi dalam fungsi js normal menggunakan ide kunci ini. Sekarang kita dapat membuat penyimpanan global pusat eksternal menggunakan fungsi-fungsi ini.

Istirahat semuanya sederhana. Terapkan saja mekanisme sinkronisasi seperti pub-sub untuk berlangganan perubahan status penyimpanan global ini.

useGState adalah paket pendidikan yang memungkinkan pengembang memahami reaksi secara mendalam.

Jika menurut Anda informasi ini bermanfaat, hubungi saya di LinkedIn untuk konten serupa lainnya.