Read function in Next.js not returning updated data after create or delete operations

huangapple go评论56阅读模式
英文:

Read function in Next.js not returning updated data after create or delete operations

问题

我已经使用Next.js 13在app文件夹中开发了一个待办事项列表应用程序。我使用Next.js编写了客户端和服务器端的代码。我可以使用读取、创建和删除功能来创建、删除和查看待办事项。我不需要添加更新功能。我使用MongoDB来存储待办事项。

我将应用程序部署到了Vercel上,网址是https://next-todolist-app.vercel.app/

然而,出现了一个问题。当我在本地运行项目时,创建、删除和读取功能都正常工作。但当我部署项目到Vercel时,只有创建和删除功能能正常工作。

当我在输入字段中输入待办事项文本并点击创建按钮时,屏幕上什么都不会显示。但是,当我打开浏览器的开发工具并检查网络选项卡时,我可以看到创建功能成功执行,并且待办事项已保存在数据库中。同样的情况也适用于删除功能,但对于读取功能我不能说同样的情况。

读取功能在每次删除和创建操作后运行,但始终返回相同的数据,没有任何错误。它会一直返回相同的数据,直到我重新构建项目。

我使用了Next.js的fetch函数提供的{ cache: "no-store" }选项,专门用于读取操作,但没有帮助。

我已经尝试解决这个问题几天了,但没有找到解决办法。

有人有什么想法吗?

仓库地址:https://github.com/aliblackeye/next-todo-app

英文:

I have developed a todo list application using Next.js 13 in the app folder. I wrote the client and server-side code using Next.js. I can create, delete, and view todos using the Read, Create, and Delete functions. I didn't need to add an update feature. I used MongoDB to store the todos.

I deployed the application on Vercel at https://next-todolist-app.vercel.app/.

However, there is an issue. When I run the project locally, the create, delete, and read functions work fine. But when I deploy the project to Vercel, only the create and delete functions work.

When I enter text for a todo in the input field and click the create button, nothing appears on the screen. However, when I open the browser's dev tools and check the network tab, I can see that the create function is successfully executed and the todo is saved in the database. The same situation applies to the delete function, but I can't say the same for the read function.

The read function runs after every delete and create operation, but it always returns the same data without any errors. It continues to return the same data until I rebuild the project.

I am using the { cache: "no-store" } option provided by Next.js' fetch function specifically for the read operation, but it didn't help.

I have been trying to solve this issue for days, but I haven't found a solution.

Does anyone have an idea?

I want the read function to return the most recent data.

Repo: https://github.com/aliblackeye/next-todo-app

答案1

得分: 0

UPDATE: 我在我的清单服务中的route.ts文件中添加了一行代码:“export const revalidate = 0;”,问题已解决。

代码链接:https://github.com/aliblackeye/next-todo-app/blob/master/app/api/todos/read/route.ts#LL1

英文:

UPDATE: I added the line "export const revalidate = 0;" to the route.ts file where I wrote my listing service and the problem was solved.

Code: https://github.com/aliblackeye/next-todo-app/blob/master/app/api/todos/read/route.ts#LL1

huangapple
  • 本文由 发表于 2023年6月13日 03:00:18
  • 转载请务必保留本文链接:https://go.coder-hub.com/76459566.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定