I am trying to get the url parameter param
from the homepage using http://localhost:3000/?param=12345
the location of index.js is pages/index.js
The file is pretty straightforward - just an embedded script and loads fine. But the router.query object is empty.
index.js:
import Head from 'next/head'
import { useRouter } from 'next/router';
export default function Home () {
const router = useRouter()
console.log('query:', router.query) // query: {}
return (
<div>
<Head>
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
<title>My Title</title>
<link rel="apple-touch-icon" sizes="180x180"
href="/apple-touch-icon.png"/>
<link rel="icon" type="image/png" sizes="32x32"
href="/favicon-32x32.png"/>
<link rel="icon" type="image/png" sizes="16x16"
href="/favicon-16x16.png"/>
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"/>
<meta name="msapplication-TileColor" content="#da532c"/>
<meta name="theme-color" content="#ffffff"/>
</Head>
<body>
<iframe id="typeform-full" width="100%" height="100%" frameBorder="0"
allow="camera; microphone; autoplay; encrypted-media;"
src="https://form.typeform.com/to/xxxxx?typeform-medium=embed-snippet"/>
<script type="text/javascript"
src="https://embed.typeform.com/embed.js"/>
</body>
</div>
)
}
How to I properly get the url parameter from index.js?