Mawazo Makuu Mawili katika Redux

Kabla ya kuanza kusoma maktaba ya Redux, tufahamiane na mawazo yake makuu mawili. Wazo la kwanza, linalohusu usimamizi wa hali, tutalichunguza kwa kutumia mfano wa kawaida wa kihesabu katika hali ya React:

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

	// Action:
	function clickHandler() {
		setCount(count + 1)
	}

	// View:
	return (
		<div>
			<span>{count}</span>
			<button onClick={clickHandler}>+</button>
		</div>
	)
}

Katika msimbo huu tunaona hali kwa kutofautisha count - hii ndiyo chanzo cha ukweli kwa kihesabu. Kisha tunaona tendo (action) - tukio, ambalo linapobofywa na mtumiaji husababisha sasisho la hali. Na, mwishowe, muonekano (view), ambayo tunatumia kuonyesha kiingilio cha mtumiaji.

Kwa hivyo mpango ni rahisi: kitufe kinabonyezwa - hali count (State) kwa kubonyeza (Action) hubadilika, kwa hivyo muonekano (View) unabadilika - kwa upande wetu hii ni nambari kwenye skrini.

Hata hivyo, kila kita kuwa ngumu zaidi ikiwa tuna viunga vingi, ambavyo vinapaswa kutumia hali moja ile ile. Bila shaka, kwa mfano, tunaweza inua hali hadi kwa viunga vya mzazi, lakini uamuzi kama huo hauweza kila wakati kukutongoa na shida. Redux katika kesi hii inapendekeza tuunde mahali pa pekee katika programu, ambapo lingekuwa na hali ya ulimwengu wote na muundo fulani wa tabia wakati wa kisasisha hali hiyo. Hiki ndicho kinachokuwa wazo la msingi la kwanza (!).

Wazo la pili linahusiana na kutobadilika, yaani, kutobadilika kwa data. Bila shaka, unakumbuka kutoka JavaScript, kwamba arrays na vitu vinaweza kubadilishwa. Kubadilisha data moja kwa moja katika Redux, kama ilivyo katika mfumo mwingine unachukuliwa kuwa tabia mbaya na inaweza kusababisha matokeo yasiyotarajiwa. Kwa hivyo katika Redux vitu na arrays zetu za awali zinapaswa kubaki zisizobadilika, na kubadilisha tunaweza tu nakala zao.

Eleza, wazo la msingi la kwanza la Redux linahusu nini.

Eleza, wazo la msingi la pili la Redux linahusu nini.