Server Action only works as prop
Unanswered
Marbled Murrelet posted this in #help-forum
Marbled MurreletOP
Maybe I’m doing something wrong, but my server action only seems to work when passed down as a prop from the server component. It does not work when imported from an
This is the simplest example I could make: https://gist.github.com/johneatmon/e4a534f81fdf2ea67723d6d7973bebfb
(the code is a working example of it being passed down as a prop)
If you need a repro, might take me a bit to put one together — hopefully there’s something obvious that jumps out? 🤔
actions.ts file in the client component.This is the simplest example I could make: https://gist.github.com/johneatmon/e4a534f81fdf2ea67723d6d7973bebfb
(the code is a working example of it being passed down as a prop)
If you need a repro, might take me a bit to put one together — hopefully there’s something obvious that jumps out? 🤔
5 Replies
Marbled MurreletOP
Weirdly, it also works if I import the action from
actions.ts and pass that down as a prop ðŸ§so it always works.
@DirtyCajunRice | AppDir so it always works.
Marbled MurreletOP
No, it doesn’t work if I import the action directly in the client component. It must be defined either in the parent, server component or imported in the parent, server component and passed down as a prop. That’s the problem.
@Marbled Murrelet No, it doesn’t work if I import the action directly in the client component. It *must* be defined either in the parent, server component or imported in the parent, server component and passed down as a prop. That’s the problem.
or so you think. I have server actions in many client components. The only thing i see weird in your code is your non async promise resolve obtuse function definition. the rest looks fine. Id console log some stuff.
Marbled MurreletOP
@DirtyCajunRice | AppDir - Seems I’m not the only one who’s encountered this issue:
https://github.com/vercel/next.js/issues/58428
https://github.com/vercel/next.js/issues/58428