I tried to use revalidateTag and revalidatePath function with the Next.js 4.2.3
The target logic is:
- there is the server action to fetch list of the items.
- also, htere is the server action to add item.
- on success item adding I would like to revalidate path with items list, due this is server rendered page, so all data is caching.
What I tried:
- was trying to add tags array to the fetch function
- was trying to use revalidatePath and revalidateTags functions
Let me share example of used logic:
These is simplified functions for get/create of items (sure the logic is more complicated, but the core things is shared here)
export default async function getItems(): Promise<ItemsList> {
//....other code
const response = await fetch("urlhere", { next: { tags: ["items_list"], revalidate: 60 } })
//...other code
}
Now, on create Item I’m trying to revalidate path and tags:
export default async function createItem(payload: ItemPayload): Promise<Item> {
//....other code
const response = await fetch(
"urlhere",
{ next: { revalidate: 0, /* other options */ } })
revalidateTag("folder_list")
revalidatePath("pathname_of_page_with_list_items", "page")
//...other code
}
As you can see, I use the same tag written at the getItems request, but when I back to the items page, the list is the same
You can be sure, that item is creates and that any errors does not occurs
But revalidatePath and revalidateTag does not works
Also was been tried unstable_noStore function
Result the same
What I tried:
was trying to add tags array to the fetch function
was trying to use revalidatePath and revalidateTags functions