Komponent-invoer in NextJS

Jy kan nie net lêers met data invoer nie, maar ook komponente, soortgelyk aan hoe ons gewoond is om te werk in gewone React. Kom ons kyk hoe dit werk.

Om mee te begin, laat ons 'n paar konvensies stel. Soos jy reeds weet, in die gids src/app word die webbladsye van die werf geplaas. Kom ons plaas ondergeskikte komponente in die gids src/comp.

Kom ons koppel nou 'n ondergeskikte komponent aan een of ander bladsy. Gestel ons het so 'n bladsy:

export default function Test() {
	return <>
		<h1>Toets</h1>
	</>;
}

Gestel ons het die volgende onderliggende komponent:

export default function Child() {
	return <p>
		kind
	</p>;
}

Kom ons voer ons ondergeskikte komponent in na ons bladsy:

import Child from '@/comp/child/child.jsx';

export default function Test() {
	return <>
		<h1>Toets</h1>
	</>;
}

Laat ons die ingevoerde komponent invoeg. Om dit te doen, gebruik 'n etiket met die naam van die komponentveranderlike:

import Child from '@/comp/child/child.jsx';

export default function Test() {
	return <>
		<h1>Toets</h1>
		<Child />
	</>;
}

Skep 'n paar ondergeskikte komponente. Voer dit in na jou bladsye.