CODEWITHSUNDEEP
reactjsnext.js
user2570135
user2570135

Reputation: 2989

How to pass a value from parent to child in ReactJS/nextjs to

I am new to reactjs/nextjs and need some help on how to pass a value from one page to another

I want to pass a value in my "Apply.jsx" page to confirmation.jsx page. The value is "name=joe"

Apply.jsx

Router.push({
            pathname: "/jobseeker/confirmation" })

confirmation.jsx. (need to get value in this function)

  const Confirmation = props => {
      const { children, classes, view, ...rest } = props;
    
      return (
        <div className="cd-section" {...rest}>
          <CardWithoutImg bold view="Seeker" link="confirm" orientation="left" />
        </div>
      );
    };

export default withStyles(blogsStyle)(Confirmation);

Upvotes: 0

Views: 366

Answers (1)

Ezzat
Ezzat

Reputation: 911

You can pass it as query

const handler = () => {
  Router.push({
    pathname: '/jobseeker/confirmation',
    query: { name: 'joe' },
  })
}

And in Confirmation you can retrieve it using useRouter hook

const Confirmation = props => {
  const router = useRouter();
  console.log(router.query) // { name : 'joe' }
  const { children, classes, view, ...rest } = props;
  ....
};

Upvotes: 1

Related Questions