node.js圖書管理小項目講解

文章目錄

• • 1，項目環境搭建
  • • 1.1項目介紹
    • 1.2案例初始化
  • 2，項目的功能實作
  • • 2.1打開首頁面圖書清單的展示
    • 2.2添加圖書功能的實作
    • 2.3圖書資訊修改功能的實作

1，項目環境搭建

1.1項目介紹

圖書管理系統：

1，通過連接配接資料庫實作圖書的增删改查操作。

1.2案例初始化

1，建立與項目相關的檔案夾

1）public靜态資源

2）model資料庫操作

3）route路由

4）views模闆

2，初始化項目檔案

npm init -y
           

3,下載下傳所需的第三方子產品

npm install express mysql art-template express-art-template --save
           

4,建立網站伺服器

5，構模組化塊化路由

6，建構圖書管理頁面子產品

2，項目的功能實作

2.1打開首頁面圖書清單的展示

1，建立books資料庫表格，

2，連接配接資料庫

3，建立路由

3，通過sql語句查詢所有圖書

4，通過模闆引擎将查詢到的所有圖書渲染到首頁面中

部分代碼展示：

index.js（入口檔案）

//入口檔案const express = require('express');
const template = require('art-template');
const bodyParser = require('body-parser');
const path = require('path');// 導入路由子產品const router = require('./router/router');const app = express();
app.use(express.static('views'))
// 設定模闆引擎的路徑
app.set('views',path.join(__dirname, 'views'));
// 設定模闆引擎app.set('view engine','art');// 安裝express-art-templateapp.engine('art', require('express-art-template'));
// 處理請求參數// 挂載參數處理的中間件   postapp.use(bodyParser.urlencoded({ extended: false }));
// 處理json參數app.use(bodyParser.json());
// 配置路由app.use(router);
//監聽端口
app.listen(3000, () => {    
 console.log('running.....');
})
           

router.js:(路由檔案）

//  路由封裝
const express = require('express');const router = express.Router();
const service = require('../server/server');
// 查詢的功能   查詢所有的書籍資訊
router.get('/books', service.showInfo);
           

service.js(業務實作檔案）

//引入相關子產品
const path = require('path');
const fs = require('fs');
const db = require('../db');
// 顯示所有的資料
exports.showInfo = (req, res) => {    
let sql = 'select * from book'    
db.base(sql, null, (result) => {        
res.render('index', { list: result });
    })}
           

2.2添加圖書功能的實作

1，點選添加按鈕跳轉到添加圖書的頁面

2，圖書添加功能的實作：

1，圖書的id實作自動增長（通過資料庫實作ID遞增功能）

2，擷取使用者所添加的資料

3，将擷取的資料添加進資料庫中

4，重新渲染首頁面

部分代碼展示：

1，）跳轉到添加圖書的頁面：

*跳轉的路由處理：

// 添加圖書的路由處理
router.get('/toAddBook', service.toAddBook);
           

*跳轉的業務處理：

// 跳轉到 添加 圖書的頁面
exports.toAddBook = (req, res) => {   
 res.render('addBook', {});
 }
           

2）添加圖書

*添加圖書功能的路由處理：

// 添加圖書的功能
router.post('/books/book', service.addBook);
           

*添加圖書功能的業務實作：

// 實作圖書資料的添加 業務

exports.addBook = (req, res) => {   
 let info = req.body;   
  let book = {};   
   for (let key in info) {        
   book[key] = info[key];  
     }  
       let sql = 'insert into book set ?';    
       db.base(sql, book, (result) => {       
        if (result.affectedRows == 1) {            
        res.redirect('index');       
         }
    });}
           

思路分析：通過req.body擷取到使用者所輸入的資料，建立一個空的book對象，周遊擷取到的資料存放在book對象中，通過sql的添加語句insert into向資料庫插入資料，通過res.redirect方法重新渲染首頁面。

2.3圖書資訊修改功能的實作

1，點選修改按鈕跳轉到對應的圖書修改頁面

2，擷取使用者點選的id值

3，通過sql查詢語句，查詢相關資訊内容渲染到修改的頁面中

4，擷取使用者修改後的資料

5，通過sql修改語句修改資料庫相關内容

6，重新渲染首頁面

部分代碼展示：

設定跳轉到編輯界面的路由

// 在修改之前 首先要跳轉到編輯的界面, id傳遞過去
router.get('/books/toeditbook', service.toEditBook);
           

跳轉到編輯界面，擷取id查詢對應的資料：

exports.toEditBook = (req, res) => {    
let id = req.query.id;   
 let sql = 'select * from book where id=?';   
  let data = [id];    
  db.base(sql, data, (result) => {     
 res.render('editBook', result[0]);    
     })}
           

思路分析：通過req.query.id擷取到使用者所修改資料的id，設定sql查詢語句查詢滿足id條件的資料渲染到修改頁面中