按钮应删除服务器端的特定项目

Question

我正在开发一个应用程序，以使用 javascript、nodejs、express 和模板引擎handelbars 来跟踪我的开支。

所以我有一个包含所有费用的 div“列表”。 （我在 div 列表旁边有一个添加按钮，在图片上不可见）

每次添加费用时，我都会添加带有删除按钮的 div“obj”、“B”按钮和一些有关费用的信息。

这是我的 html 中的代码：

<div class="list">

{{#each expArr}}
    <div id="obj" class="obj">
     <form action="/removetodo" method="POST" >
     <button class="btn2">X</button> 
    </form>

    <button onclick="openNav()" class="btn">B</button>
    <a>{{date}}</a> <n>{{name}}</n> <a>{{value}} </a>
    {{description}}  
    </div>
{{/each}}

现在，我的后端正在使用 express 的 NodeJS 服务器上运行。

这是我的 index.js 文件：

var express = require('express');
var router = express.Router();


var expArr = [];


router.get('/', function(req, res, next) {
  res.render('index' , {expArr: expArr} );
});

 router.post('/addtodo', function (req, res, next) {



 var exp = new Object();

 exp.name = req.body.name;
 exp.value = req.body.val;
 exp.date = req.body.date;
 exp.description = req.body.descr;




 expArr.push(exp);
 res.redirect('/');

  });
 router.post('/removetodo', function (req, res, next) {


 expArr.pop();

 res.redirect("/");

 });


  module.exports = router;  

在 addtodo 中，我只是将所有信息添加到服务器上的一个数组中（稍后我将添加一个数据库）。

现在我的问题：

每笔费用上的删除按钮应删除正确的费用。 换句话说，我希望通过单击删除按钮，删除服务器上数组中的正确条目。

我该怎么做？

谢谢！

Answer 1

您将所有内容都存储在内存中，认为这是理所当然的，您可以先使用普通对象而不是数组来存储数据

expArr = {}

然后为每个实例添加一个唯一标识符，例如哈希或日期（以毫秒为单位）

var exp = new Object();
exp.id = new Date().getUTCMilliseconds();
exp.name = req.body.name;
exp.value = req.body.val;
exp.date = req.body.date;
exp.description = req.body.descr;

expArr[exp.id] = exp;

现在，当您要删除费用时，请务必从客户端传递正确的 ID

router.post('/removetodo', function (req, res, next) {
 if(expArr[req.body.id]) {
   delete expArr[req.body.id];
 }
 res.redirect("/");
});