Njia ya Faharasa katika React Router

Katika somo hili tutajua ni nini njia za faharasa.

Kwanza, tuzingatie jambo moja. Tunapokuwa kwenye ukurasa wa kwanza, upande wa kulia tunaona skrini tupu. Hii ni kwa sababu hakuna njia yoyote ya watoto inayofanana na anwani /, na hatujasema nini cha kuonyesha katika kesi hii. Katika hali kama hiyo, ili kuepuka kuonyesha ukurasa tupu, tunaweza kutumia njia ya faharasa - hiyo ni njia ya watoto ambayo haina anwani, na kipengele chake kinaonyeshwa kwenye Outlet ya mzazi wakati hakuna njia yoyote ya watoto inayofanana. Kwa kutumia njia kama hizi, tunaweza kuweka taarifa fulani, au takwimu, au kitu kingine chochote kama hicho. Kama ilivyo kwa njia za kawaida, zinaweza kutumika kwa upakiaji wa data.

Wacha tuunde faili index.jsx katika folda routes, na ndani yake kipengele Index:

export default function Index() {
	return (
		<div>
			<p>Habari, React Router!</p>
			<p>Huu ni programu ya bidhaa zangu :)</p>
		</div>
	);
}

Sasa tuende kwenye main.jsx na tuingize kipengele chetu Index:

import Index from './routes/index';

Na kipengele cha kwanza katika safu children tuongeze kitu, ambapo sifa index imewekwa kuwa true, na kama kipengele cha kuonyesha kitakuwa kipengele chetu Index:

{ index: true, element: <Index /> },

Chukua programu uliyoiumba katika kazi za somo lililopita. Kwa kutumia nyenzo za somo, ongeza njia ya faharasa kwa anwani ya ukurasa wa kwanza na maandishi yoyote.