State - Managing State Inside Components

Maareynta State Gudaha Components ee React.js

State waa mid ka mid ah qaybaha ugu muhiimsan ee React.js. Waa qayb ka mid ah xogta lagu kaydinayo gudaha component-ka taas oo keeni karta in component-ka uu dib isu cusbooneysiiyo markasta oo state-ka la beddelo. Fikradda guud ee state waa in uu ka caawiyo abuurista is-dhexgalka isticmaalaha iyo in xogta lagu maamulo si firfircoon.

 State - Managing State Inside Components

Waa Maxay State?

State waa object ku jira component-ka taas oo ay ku kaydsan tahay xogta muhiimka ah ee la isticmaalo marka la doonayo in la cusbooneysiiyo interface-ka. Waxa uu noqon karaa mid ka mid ah xogaha ay ku jiraan qiimaha isticmaalaha, xaaladda toggles, ama xog kale oo muhiim u ah natiijada shaashadda.

Component kasta oo leh state wuxuu leeyahay awoodda inuu ka jawaabo isbeddelada xogta si dhaqso ah. Sidaas darteed, mar kasta oo state-ka beddelmo, React waxay dib u cusbooneysiisaa component-ka si ay uga muuqato isbeddelada cusub ee la sameeyay.

Tusaale:

Waxaan qaadan karnaa tusaale fudud oo ah state-ku sida uu uga shaqeeyo gudaha functional component iyadoo la isticmaalayo hook-ka caanka ah ee useState.

javascript

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);

  const increaseCount = () => {
    setCount(count + 1);
  };

  return (
    <div>
      <h1>{count}</h1>
      <button onClick={increaseCount}>Kordhi tirada</button>
    </div>
  );
}

export default Counter;

Sida Looga Shaqeeyo State

Waxaad isticmaashaa hook-ka useState si aad u abuurto state-ka gudaha functional components. Tusaalaha kore wuxuu abuuri doonaa counter component leh tirada ku kaydsan state. Markii isticmaaluhu gujiyo badhanka, tirada waxay sii kordheysaa maadaama state-ka la cusbooneysiinayo. setCount waa shaqada loo isticmaalo in lagu cusbooneysiiyo qiimaha state-ka.

State Lifecycle

State wuxuu leeyahay nolosho ku xiran component-ka laftigiisa. Marka component-ka la abuuro, state-ka waxaa la dhisaa. Marka component-ka la burburiyo (unmount), state-ku wuu burburaa. Nolosha state-ka iyo sida uu u beddelmo waxay sidoo kale ka tarjumaysaa xaaladda isticmaalaha iyo xogta interface-ka.

Gabagabo Maareynta state waa qayb muhiim ah oo ka mid ah horumarinta React. Waxay siisaa horumarisa-yaasha habab firfircoon oo ay ku maarayn karaan xogta iyo sida loo abuuro components wax-qabad leh oo ka jawaaba isbedelada isticmaalaha. Inaad barato state-ku wuxuu kuu diyaarinayaa inaad si buuxda uga faa’iideysato awoodaha React.