Handling user interactions and event handlers in Server Components in NextJS
Unanswered
West African Lion posted this in #help-forum
West African LionOP
I am trying to fetch data from API and render in server component. I receive data for filter selection and user will be able to update or remove the filter. I want my data to be rendered in server side but since i cant use event handlers in server component how can i achieve it?
https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#interleaving-server-and-client-components
I was able to segregate client and server component and render data.
But if i have user interaction inside the server rendering data how do i achieve it?
Any clues would be highly appreciated.
https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#interleaving-server-and-client-components
I was able to segregate client and server component and render data.
But if i have user interaction inside the server rendering data how do i achieve it?
Any clues would be highly appreciated.
5 Replies
@West African Lion I am trying to fetch data from API and render in server component. I receive data for filter selection and user will be able to update or remove the filter. I want my data to be rendered in server side but since i cant use event handlers in server component how can i achieve it?
https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#interleaving-server-and-client-components
I was able to segregate client and server component and render data.
But if i have user interaction inside the server rendering data how do i achieve it?
Any clues would be highly appreciated.
if you using searchparams (what I would recommend for filters), you can redirect the user to the specifc searchparams and the server will do the rest. The server reads the searchparams, apply the filter for your data system and return the generated page
@West African Lion hello?
West African LionOP
Thanks for the response.
But i not only have filters, there are other user related events and i want to keep in them client and pass a props to server. Is there any way to achieve it?
But i not only have filters, there are other user related events and i want to keep in them client and pass a props to server. Is there any way to achieve it?
@West African Lion Thanks for the response.
But i not only have filters, there are other user related events and i want to keep in them client and pass a props to server. Is there any way to achieve it?
Yes, depending on the events you can use server actions. These are functions, that work like normal functions, but they run serverside
@West African Lion solved?