Dua Idea Asas dalam Redux

Sebelum memulakan pembelajaran perpustakaan Redux, mari kita berkenalan dengan dua idea asasnya. Idea pertama, yang berkaitan dengan pengurusan keadaan, kita akan lihat menggunakan contoh pembilang biasa pada state dalam 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>
	)
}

Dalam kod ini, kita melihat state untuk pemboleh ubah count - ini adalah sumber kebenaran untuk pembilang. Kemudian kita melihat tindakan (action) - peristiwa, yang upon klik pengguna mencetuskan kemas kini state. Dan akhirnya, paparan (view), yang digunakan untuk memaparkan antara muka pengguna.

Oleh itu, skemanya agak mudah: tombol ditekan - state count (State) upon tekan (Action) berubah, oleh itu paparan (View) berubah - dalam kes kita ini adalah nombor pada skrin.

Walau bagaimanapun, semuanya akan menjadi lebih rumit jika kita mempunyai banyak komponen yang perlu menggunakan state yang sama. Sudah tentu, kita boleh, contohnya, mengangkat state ke atas ke komponen induk, tetapi penyelesaian sedemikian tidak selalu dapat menyelesaikan masalah. Redux dalam kes ini mencadangkan kita untuk mencipta satu tempat dalam aplikasi, yang akan mengandungi keadaan global dan corak tingkah laku tertentu apabila mengemas kini keadaan tersebut. Inilah inti pati idea asas pertama (!).

Idea kedua berkaitan dengan ketidakubahan, iaitu, ketidakubahan data. Anda, sudah tentu, ingat dari JavaScript, bahwa array dan objek boleh diubah. Mengubah data secara langsung dalam Redux, seperti dalam rangka kerja lain, dianggap sebagai amalan buruk dan boleh membawa kepada akibat yang tidak dijangka. Oleh itu dalam Redux, objek dan array asal kita perlu kekal tidak berubah, dan kita hanya boleh mengubah salinannya.

Terangkan, apakah inti pati idea asas pertama Redux.

Terangkan, apakah inti pati idea asas kedua Redux.