javascript - 全局数组在我的 JavaScript 程序中保留刷新数据
问题描述
我正在尝试制作一个待办事项列表,我想在其中使用表单将新项目添加到列表中。该列表工作正常,但是当我刷新页面时,已经存储在数组中的数据被保留。我不想那样。
我希望在每次刷新时,旧数据都会丢失,新项目会被推送到数组中。但是每次我必须杀死并重新启动服务器时都要这样做。
initial list:
li1
li2
li3
after item addition:
li1
li2
li3
li4
li5
after refresh: (expected)
li1
li2
li3
after refresh: (actual o/p)
li1
li2
li3
li4
li5
我的代码:
const express = require("express");
const bodyParser = require("body-parser");
const app = express();
var Item = ["Home List","Shop List","Bucket List"];
app.use(bodyParser.urlencoded({extended:true}));
app.set("view engine","ejs");
var options = {
weekday:"long",
day:"numeric",
month:"long"
};
app.get("/", function (req, res) {
var today = new Date();
var currentDay = today.toLocaleDateString("en-US",options);
res.render("lists",{
day: currentDay,
newListItem : Item
});
});
app.post("/",function(req,res){
Item.push(req.body.newItem);
res.redirect("/");
});
app.listen(3000, function () {
console.log("Server on port 3000");
});
解决方案
要做到这一点,需要能够区分/
由于用户按下刷新而发出 GET 请求的浏览器和由于/
任何其他原因发出 GET 请求的浏览器……而 HTTP确实不是为此而设计的。
“刷新”的意思是“给我这个资源的最新版本”。这并不意味着资源应该响应请求而更改(除非资源类似于旨在显示当前时间的页面……但那里的更改是由时间更改而不是刷新本身触发的)。
如果你想重置数组,然后写一个明确设计的端点来重置它,然后为用户提供一个表单和提交按钮,该按钮发布到该 URL。
app.post("/reset",function(req,res){
Item = ["Home List","Shop List","Bucket List"]
res.redirect("/");
});
推荐阅读
- python - 扩展具有相同名称的 Python 类并返回子类实例
- webpack - Hyperapp / Webpack - 如何编码拆分组件
- python - 根据第 1 列中的不同值获取行,同时尽可能多地保留第 2 列中的不同值
- javascript - 如何在选择中的 react.js 语义 ui 中添加标签
- flutter - Flutters Just Audio Plugin - 让背景透明?
- azure - 如何在 Azure 数据工厂管道上按顺序批处理存储过程?
- wordpress - 如何将多个 Wordpress API 请求合二为一?
- python - 如何使用 python 脚本模拟 windows 可执行文件的命令?
- python - pywinauto.findwindows.ElementAmbiguousError: 有 2 个元素符合条件 {'backend': 'uia', 'process': 12796}
- python - 来自 libtorch_cuda_cpp.so(Pytorch)的分段错误