0

I am having an issue where I am trying to pass state on a link but I keep getting undefined when using the state. My Quiz card layout function takes in the details and then links the page when the button is clicked passing the details as the state. Then in my child/link function, I try using the state.

-- I am trying to pass props in my Link by using the state in which I can then refer to my child/linked function to use the information passed on. I am currently learning React (16.2) and any information would be appreciated thank you. I am using functional components as well would there be a better approach? My initial approach is when the user clicks the button it'll link them to a new tab page and display the information from the previous page via the Link. I will post more info if needed.

enter image description here

enter image description here

In my child/link PetLayout function, I tried using the props to see if it contains the state and the useLocation but both are undefined.

enter image description here

In my App js I have the Route

enter image description here

UPDATE: My issue was the target = '_blank' in this case it works now. Why does the target = '_blank' cause this issue where the state is undefined?

Daniel S
  • 11
  • 1
  • 4
  • I guess your data resides inside `props.location.state` inside PetLayout component. Try doing a console log of `props.location.state`. – Siddhant Varma Nov 15 '20 at 04:54
  • @SiddhantVarma I removed the target='_blank' which resolved the issue but do you know why this is the case? Edit: Is it possible to open a new tab using the target and pass this information? – Daniel S Nov 15 '20 at 04:55
  • @DanielS Hope this may help [link](https://stackoverflow.com/questions/63151000/pass-state-via-link-while-redirected-to-a-new-tab) – Dark shadow Nov 15 '20 at 05:20

1 Answers1

0

@Daniel S _blank is opening in new tab so its another instance of the app, even the app is same but it works differently internally so I would suggest you to use queryString and localStorage.

Antier Solutions
  • 1,326
  • 7
  • 10