Nextjs Route 여러 이름 라우팅

 

'vegetable1/[name1].tsx'

import { useRouter } from 'next/router';

const App1 = () => {

	const {query:query1} = useRouter();

	return (
		<div>
			<h2> vegatable1 folder name1: {query1.name1}</h2>
		</div>
	);
};

export default App1;

 

실행결과

http://localhost:3000/vegetable1/fff

 

http://localhost:3000/vegetable1/asdf111

 

param받기

Ex http://localhost:3001/vegetable2/kim?nick=king

import Link from 'next/link';
import { useRouter } from 'next/router';

const App1 = () => {

	const {query:qr1} = useRouter();

	return (
		<div>
			<h2> vegatable2 folder name1: {qr1.name1} nick: {qr1.nick}</h2>
		</div>
	);
};

export default App1;