Node.js+Express+Mongoose待办应用:移至已完成列表功能失效
待办列表应用「移至已完成」功能故障排查与修复
问题概述
基于Node.js、Express和Mongoose开发的待办列表应用,点击「Move to Done List」按钮后无任何反馈,已完成列表无法渲染对应条目,且控制台无报错信息。
故障原因分析
- Mongoose模型缺失必要字段:
folderList模型的Schema未定义checked属性,Mongoose默认不会保存Schema中未声明的字段,导致标记为已完成的操作无法持久化到数据库。 - 模板渲染数据不完整:路由仅将未完成的条目(
!item.checked)传递给模板变量folderLists,而EJS模板尝试遍历folderLists查找checked=true的条目,自然无法找到已完成内容。
解决方案
1. 补充Mongoose模型字段
修改folderList.js模型文件,添加checked字段并设置默认值为false:
const mongoose = require('mongoose'); const folderListSchema = new mongoose.Schema({ name: { type: String, required: true }, folder: { type: mongoose.Schema.Types.ObjectId, ref: 'Folder', required: true }, checked: { type: Boolean, default: false } // 新增已完成标记字段 }); const FolderList = mongoose.model('FolderList', folderListSchema); module.exports = FolderList;
2. 调整路由数据传递逻辑
修改folderLists.js路由中的GET请求处理,将已完成和未完成条目分开传递给模板:
router.get('/:id', async (req, res) => { try { const { id } = req.params; const folder = await Folder.findById(id); const allItems = await FolderList.find({ folder: id }); const folderLists = allItems.filter(item => !item.checked); // 未完成列表 const doneLists = allItems.filter(item => item.checked); // 已完成列表 res.render('folderLists', { folder, folderLists, doneLists }); } catch (err) { console.error(err); res.status(500).send(err.message); } });
3. 修正EJS模板渲染逻辑
更新folderList.ejs中已完成列表的遍历对象,改为使用新传递的doneLists变量:
<h2>Done List</h2> <ul> <% doneLists.forEach(doneItem => { %> <li> <%= doneItem.name %> <!-- Additional actions if needed --> </li> <% }); %> </ul>
4. 优化更新操作(可选)
将路由中标记已完成的逻辑改为直接使用findByIdAndUpdate,减少实例操作步骤,提升可靠性:
router.post('/:id/moveToDone/:itemId', async (req, res) => { try { const { itemId } = req.params; await FolderList.findByIdAndUpdate(itemId, { checked: true }); res.redirect(`/folderLists/${req.params.id}`); } catch (err) { console.error('Error moving item to Done List:', err); res.status(500).send(err.message); } });
内容的提问来源于stack exchange,提问作者Mads
相关产品推荐
相关产品推荐

