上篇文章分享了簡單的三層模式和基礎檔案夾的創建，本篇將以示例的形式詳細具體的展示Router、Controller、Service、Model之間業務處理和資料傳輸，
1. 班級管理資料模型創建，資料模型是通過Sequelize的ORM技術實作，關于Sequelize技術，將在后續文章中分享，
在上篇文章中的models檔案夾中創建班級模型class.ts，資料結構為：ID，班級名稱，班級編碼，班主任ID，代碼如下：
import { Table, Model, Column, DataType, PrimaryKey } from "sequelize-typescript";
import DbSequelize from "../db_config";
@Table({
tableName: 't_class'
})
export default class Class extends Model<Class> {
//唯一標識
@Column({ type: DataType.STRING, primaryKey: true })
id: string;
//班級名稱
@Column({ type: DataType.STRING, field: 'class_name' })
className: string;
//班級編碼
@Column({ type: DataType.STRING, field: 'class_code' })
classCode: string;
//班主任Id
@Column({ type: DataType.STRING, field: 'head_teacher_id' })
headTeacherId: string;
}
DbSequelize.addModels([Class]);
注：由于尚未講解Sequelize相關技術，所以這里只需要明白班級結構即可，
2.班級管理服務創建，在services檔案夾中創建class.ts，實作最基礎的增刪改查的服務方法，代碼如下：
import Class from '../models/class'; var Op = sequelize.Op; //班級管理服務 export default class ClassService { //獲取所有班級 async findClassList() { try { return Class.findAll({ attributes: ['id', 'calssName', 'calssCode', 'headTeacherId'] }); } catch (err) { throw (err); } } //獲取單個班級 async findClassById(classId: string) { try { return Class.findOne({ attributes: ['id', 'calssName', 'calssCode', 'headTeacherId'], where: { id: classId } }); } catch (err) { throw (err); } } //洗掉班級 async deleteClass(classId: string) { try { return await Class.destroy({ where: { id: classId } }); } catch (err) { throw (err); } } //修改班級 async editClass(class: any) { try { return await Class.update(class, { where: { id: class.id }, individualHooks: true }); } catch (err) { throw (err); } } //添加班級 async addClass(class: any) { try { return await Class.create(class); } catch (err) { throw (err); } } }
注：由于尚未講解Sequelize相關技術，所以這里只需要明白班級服務中基礎的操作就是簡單的增刪改查即可，有關分頁，復雜查詢也將在后篇中分享，
3.班級管理控制器創建，在controllers檔案夾中創建class.ts，實作最基礎的增刪改查的業務方法，代碼如下：
import ClassService from '../services/class';const clsService = new ClassService();
//班級管理控制器 export default class ClassController { //查找所有班級 static async findClassList(ctx: any) { try { //呼叫查詢串列服務，獲取結果 let res = await clsService.findClassList(); ctx.body = { status: 1,//回傳碼：1操作成功，0操作錯誤 data: { classList: res } } } catch (err) { ctx.throw(err.message); } }
//根據班級id獲取班級詳細資訊 static async findClassById(ctx: any) { try { let id = ctx.request.query.id; if (!id) { ctx.body = { status: 0 } return; } //呼叫查詢詳情服務，獲取結果 let res = await clsService.findClassById(id); ctx.body = { status: 1, data: { class: res } } } catch (err) { ctx.throw(err.message); } }
//洗掉班級 static async deleteClass(ctx: any) { try { let id: string = ctx.request.body.id; //呼叫洗掉服務，獲取結果 let res: any = await clsService.deleteClass(id); if (res[0] === 1 && res[1][0].delFlag === 1) { ctx.body = { status: 1, data: { classId: res[1][0].id } } } else { ctx.body = { status: 0 } } } catch (err) { ctx.throw(err.message); } }
//修改班級 static async editClass(ctx: any) { try { let obj: any = ctx.request.body; //呼叫修改服務，獲取結果 let res = await clsService.editClass(obj);
if (res[0] !== 1) { ctx.body = { status: 0 } } else { ctx.body = { status: 1, data: { classId: res[1][0].id } } } } catch (err) { ctx.throw(err.message); } }
//添加班級 static async addClass(ctx: any) { try { let obj: any = ctx.request.body; //呼叫添加服務，獲取結果 let res = await clsService.addClass(obj);
if (!res) { ctx.body = { status: 0 } } else { ctx.body = { status: 1, data: { classId: res.id } } } } catch (err) { ctx.throw(err.message); } } }
注：此處的班級管理控制器，僅僅實作對增刪改查服務的呼叫，后篇慢慢會添加班級對班主任資訊的獲取等相關業務邏輯的操作，
4. 設定路由
4.1 添加路由中間件
npm i koa-router
npm i @types/koa-router
4.2 在router.ts中，添加如下代碼：
import KoaRouter from 'koa-router'; //引入班級管理控制器 import ClassController from './controllers/class';const router = new KoaRouter(); router.post('/api/class/addClass', ClassController.addClass); router.post('/api/class/editClass', ClassController.editClass); router.post('/api/class/deleteClass', ClassController.deleteClass); router.get('/api/class/findClassById', ClassController.findClassById); router.get('/api/class/findClassList', ClassController.findClassList);
export default router;
4.3 在app.ts中，添加路由中間件
const Koa = require('koa'); const app = new Koa(); //引入路由 import router from './router'; //添加路由中間件 app.use(router.routes()); app.use(router.allowedMethods()); app.use(async (ctx: any) => { ctx.body = 'Hello World...Hello LaoLv'; }); console.log('app server start on port 3000...') app.listen(3000);
這樣，整個router--controller--service--model之間的資料呼叫基本完成，但是由于sequlize沒有安裝，大家如果直接復制代碼會報錯，所以，以上代碼僅僅是一個熟悉了解整個程序，
下面，大家可以把model，service中的代碼都注釋掉，修改controller和router，簡單運行一個路由作為舉例，
controllers-->class.ts
//班級管理控制器 export default class ClassController { //查找所有班級 static async findClassList(ctx: any) { try { ctx.body = { status: 1,//回傳碼：1操作成功，0操作錯誤 data: { classList: '這是測驗資料' } } } catch (err) { ctx.throw(err.message); } } }
router.ts:
import KoaRouter from 'koa-router'; //引入班級管理控制器 import ClassController from './controllers/class'; const router = new KoaRouter(); router.get('/api/class/findClassList', ClassController.findClassList); export default router;
這樣，代碼就不會報錯了，然后F5，我們運行一下：
1. 控制臺輸出成功
2. 瀏覽器顯示成功
3. 瀏覽器輸入 /api/class/findClassList，看看結果
以上三條，證明路由呼叫成功：呼叫controller中相關方法，后面再細致分享router，sequelize相關技術知識點，
附：代碼結構如下
（文章為老呂原創，轉載請注明出處）
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/242298.html
標籤：架構設計