- 项目需要创建的文件
- index.js(创建的入口函数)
- router.js(存放路由相关模块)
- service.js(存放业务逻辑模块)
- data.json(用来存放数据的文件,存放的格式:[ obj1,obj2,.....])
- views(存放模板文件 后缀为.art)
- public(存储静态文件)
- package,json(输入指令:npm init -y)
- node_modules及package_lock.json(在控制台输入指令 :npm install art-template express body-parser express-art-template --save自动创建)
- 图书管理系统的入口文件index.js
const express=require('express'); const template=require('art-template'); const bodyParser=require('body-parser'); const path=require('path'); const router=require('./router.js');// 封装路由 const app=express(); // 设置模板的路径 app.set('views',path.join(__dirname,'views')); // 设置模板引擎 app.set('view engine','art'); // 使用express兼容 art-template 模板引擎 app.engine('art',require('express-art-template')); // 处理请求参数(post) // 挂载参数处理中间件(post) app.use(bodyParser.urlencoded({extended:false})); // 将路由整体封装在一个,模块中 自定义的模块 router.js // 处理json格式的参数 app.use(bodyParser.json()); // 配置路由 app.use(router); app.listen(3001,()=>{ console.log('running........'); })
- router.js实现
-
const express=require('express'); const router=express.Router(); const service=require('./service.js'); // 查询所有的书籍 router.get('/',service.showIndex); // 设置静态文件服务 router.use('/www',express.static('public'));
对应service.js的部分
-
const data=require('./data.json'); const fs=require('fs'); const path=require("path"); // 渲染主页面==> 就是指获取json中的数据 通过模板引擎渲染在主页面上(index.art) exports.showIndex=(req,res)=>{ res.render('index.art',{list:data}); }
router.js实现增删改的路由分发
-
将添加的链接写入:
<a href="/toAddBook">
- 修改的链接:
<a href="/toEditBook?id={{$value.id}}" class="xg">修改</a>
- 删除的链接:
<a href="/toDelBook?id={{$value.id}}" id="delete">删除</a>
- 若要引入css文件则:
<link rel="stylesheet" href="www/style.css">
-
// 添加图书(跳转到添加图书的界面) router.get('/toAddBook',service.toAddBook); // 添加图书(提交表单数据) router.post('/addBook',service.addBook); // 跳转到 编辑图书的界面 router.get('/toEditBook',service.toEditBook); // 编辑图书提交表单数据 router.post('/editBook',service.editBook); // 删除图书信息 router.get('/deleteBook',service.deleteBook); module.exports=router;
对应的service.js部分
-
// 提交添加的数据 /* - 添加的功能==>显示跳转的页面===>点击提交表单数据 - (1)点击添加图书的链接===> 设置跳转的路径(路由) /toAddBook index.html修改为index.art - (2)router.js文件中设置路由 router.get('/toAddBook',业务模块(service.toAddBook)) - (3)实现业务模块中的跳转到添加图书的界面 service -->toAddBook---> 将art文件渲染显示在浏览器 - (4)设置提交表单数据的路由 /addBook - (5)router.js文件中 设置表单提交的路由 router.post('/addBook',service.addBook); - (6)service.js文件中 实现提交数据的功能 ==>提交到json文件中(前提:获取添加的数据) - (7)添加到json文件中(前提: 自动产生id的值)===>json
-
// 修改图书信息的功能 《1》点击修改图书的链接===》设置跳转的路由 /toEditBook?id={{$value.id}} 写一个editBook.art模板 《2》router.js文件中设置路由 router.get('/toEditBook',业务模块(service.toEditBook)) 《3》实现业务模块的跳转到修改图书的界面 service -->toEditBook---> 将editBook.art文件渲染显示在浏览器 《4》点击提交按钮,设置跳转路由(/editBook),让editBook.art模板的id隐藏, 《5》service.js文件中 获取修改后提交的数据(若此时的id和data.id相等,则将替换data[index]的值) 最后将他写入json文件 实现提交数据的功能 ==>提交到json文件中
-
-->删除功能 <1>点击删除的链接===》/toDelBook?id={{id}}; <2>设置删除的路由router.get('/toDelBook',service.toDelBook); <3>设置业务模块,获取传回的id,对data进行遍历,当id相同时,截取此时的data[index] 最后将data在写入到json文件中
-
const data=require('./data.json'); const path=require('path'); const fs=require('fs'); //添加图书的业务模块 // 跳转到添加图书的页面 exports.toAddBook=(req,res)=>{ res.render('addBook',{}); } //添加数据后提交数据时 exports.addBook=(req,res)=>{ // 获取表单的数据 let info = req.body; let book={}; info.id=maxBookCode()?maxBookCode():0; info.id+=1; data.push(info); // 把内存中的数据写入进 data.json文件中 writeDataToFile(res); } //封装一个函数 let maxBookCode=()=>{ let arr=[]; data.forEach((item)=>{ // 循环 每找到一个id 就存储在数组中arr arr.push(item.id); }); // 获取数组中最大的值 return Math.max.apply(null,arr); } //封装一个写文件的函数 let writeDataToFile=(res)=>{ fs.writeFile(path.join(__dirname,'data.json'),JSON.stringify(data),(err)=>{ if(err){ res.send('server Error'); } // 文件写入成功 应该跳转到一个页面 主页面 res.redirect('/'); // 页面路由 的重定向 ==> 跳转到一个页面 }) } 修改的业务模块 // 跳转编辑页面 exports.toEditBook=(req,res)=>{ // 1, 获取点击修改传递过来的id值 let id=req.query.id; let book={}; data.forEach((item)=>{ if(id==item.id){ // 点击修改的id 和json数据中的id相等 book=item; return; } }) res.render('editBook',book); } // 编辑图书更新数据 /* - 当我们点击 提交按钮 获取到表单中所有的数据 - 通过 id遍历json文件中 都获取 - 判断url中的id和json文件中的id一样 直接替换 - */ exports.editBook=(req,res)=>{ let info=req.body; data.forEach((item)=>{ if(info.id==item.id){ console.log(item); for(let key in info){ // 将一个对象中的成员 添加给另一个对象 需要使用拷贝的方式实现 item[key]=info[key]; } return; } }); // 把内存中的数据写入进 data.json文件中 writeDataToFile(res); } // 删除图书信息 exports.deleteBook=(req,res)=>{ let id=req.query.id; // console.log(id); data.forEach((item,index)=>{ if(id==item.id){ // 删除一组数据 data.splice(index,1); } return; }) // 把内存中的数据写入进 data.json文件中 writeDataToFile(res); }
原文地址:https://blog.csdn.net/Yesterdayw/article/details/100008325
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。