revalidate nextjs cache help
Answered
Tomistoma posted this in #help-forum
TomistomaOP
Im running this function in a form submission:
However, the
const handleSubmit = async (values: typeof form.values) => {
await updateUserName({
user_id,
username: values.name,
})
.then(() => {
notifications.show({
message: `Updated username to ${values.name}!`,
});
})
.catch(() =>
notifications.show({
color: 'red',
message: `There was a problem updating your username. Please try again later.`,
})
);
form.reset();
revalidatePath('/profile/me');
};However, the
revalidatePath function is not being called in my client component? Why notAnswered by Ray
Because the data cache is on the server, client wont be able to access it. Therefore, revalidatePath should be used on server side.
You should use server action for the form submission
You should use server action for the form submission
3 Replies
@Tomistoma Im running this function in a form submission:
tsx
const handleSubmit = async (values: typeof form.values) => {
await updateUserName({
user_id,
username: values.name,
})
.then(() => {
notifications.show({
message: `Updated username to ${values.name}!`,
});
})
.catch(() =>
notifications.show({
color: 'red',
message: `There was a problem updating your username. Please try again later.`,
})
);
form.reset();
revalidatePath('/profile/me');
};
However, the `revalidatePath` function is not being called in my client component? Why not
Because the data cache is on the server, client wont be able to access it. Therefore, revalidatePath should be used on server side.
You should use server action for the form submission
You should use server action for the form submission
Answer
TomistomaOP
okay
Is updateUserName a server action? You could run revalidatePath inside it