How to pass values from child element to parent element?
Answered
Mandarin fish posted this in #help-forum
Mandarin fishOP
How can I, for example, pass a variable from the header component in layout.jsx to another component in content.jsx?
Answered by B33fb0n3
@Mandarin fish you can define the variable in your layout. If you want to fetch data, fetch it twice. The data cache will hit and you still have one request
18 Replies
Plott Hound
are you trying to pass props from a client component to a server component?
@Mandarin fish you can define the variable in your layout. If you want to fetch data, fetch it twice. The data cache will hit and you still have one request
Answer
@Plott Hound are you trying to pass props from a client component to a server component?
Mandarin fishOP
from client to client component
@Mandarin fish from client to client component
Plott Hound
your layout.tsx is a client component? that is an antipattern in app router.
@Mandarin fish done this? https://nextjs-forum.com/post/1191752716268081254#message-1191768289551056936
do it like that and it should work
Mandarin fishOP
I need to pass a variable from header to content.jsx like from child to parent
@Mandarin fish I need to pass a variable from header to content.jsx like from child to parent
Plott Hound
cant you just pass it as a prop?
or useContext, which would be overkill tbh
@Plott Hound cant you just pass it as a prop?
Mandarin fishOP
it doesn't work.
Plott Hound
share your code
@Plott Hound share your code
Mandarin fishOP
of what,
?
Plott Hound
you said it doesnt work when you try to pass props, but we cant see your code to know why it wouldnt work
yea, share your code
Mandarin fishOP
I've already found a solution to the problem
@Mandarin fish I've already found a solution to the problem
Plott Hound
ok mark this as solved, there is a comment under your post explaining how