CODEWITHSUNDEEP
next.js
Eranki
Eranki

Reputation: 807

Sending data through Link tag in next js

I'm passing a state data to the redirected page using Link tags in next js.

From home page I'm redirecting to course page with courseData in state.

<Link href={{pathname: '/course', state: {courseData}}}>
   <a>Link</a>
</Link>

And in the course page when I access props.location and I get undefined:

function course(props) {
   console.log(props.location) //undefined
}

Is this the right way to send the state and receive in props?

Upvotes: 0

Views: 732

Answers (1)

Oleg Om
Oleg Om

Reputation: 439

Currently that's not possible to pass state using Links.

You can pass string value with query param

import Link from "next/link";

<Link href={{ pathname: '/course', query: { keyword: 'string value' } }}>
    <a>path</a>
</Link>

<Link href="/post/abc?foo=bar">
    <a>path</a>
</Link>

Also you can save any required state in localStorage, sessionStorage, a variable, a Redux store, etc. and then use it in getInitialProps

Upvotes: 1

Related Questions