Inleiding tot die Komponentbenadering in React

Laat ons aanneem ons het 'n webwerf. Op hierdie webwerf kan ons sommige blokke uitlig: die kop, inhoud, sidebar, voetskrif, ensovoorts. Elke blok kan verdeel word in kleiner subblokke. Byvoorbeeld, in die kop kan ons gewoonlik die logo, die spyskaart, die kontakblok, ensovoorts uitlig.

In React word elke sodanige blok 'n komponent genoem. Elke komponent kan kleiner komponente in hom bevat, wat op hul beurt nog kleiner komponente kan bevat, ensovoorts.

Aan elke komponent in React word 'n ES6-module gekoppel, gelê in die gids src. Die naam van die lêer met die module word met 'n hoofletter geskryf en moet ooreenstem met die funksie wat in die kode van hierdie module gelê is.

Byvoorbeeld, die lêer met die naam App.js moet binne-in die funksie App bevat:

import React from 'react';

function App() {
	// komponentkode
}

export default App;

Een van die komponente moet die hoofkomponent wees - die een waaraan die ander komponente toegevoeg word. In React sal die komponent App by verstek hierdie komponent wees. Ander komponente sal aan hierdie komponent gekoppel word. Hoe dit gedoen word - sal ons verder in die handleiding bespreek.