Vue2+Koa2+Typescript前后端框架教程--04班级管理示例（路由调用控制器）

上篇文章分享了简单的三层模式和基础文件夹的创建，本篇将以示例的形式详细具体的展示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-routernpm 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相关技术知识点。

 

附：代码结构如下

 

（文章为老吕原创，转载请注明出处）









原文转载：http://www.shaoqun.com/a/504392.html

跨境电商：https://www.ikjzd.com/

智邦：https://www.ikjzd.com/w/2376

retriever：https://www.ikjzd.com/w/773


上篇文章分享了简单的三层模式和基础文件夹的创建，本篇将以示例的形式详细具体的展示Router、Controller、Service、Model之间业务处理和数据传输。1.班级管理数据模型创建。数据模型是通过Sequelize的ORM技术实现，关于Sequelize技术，将在后续文章中分享。在上篇文章中的models文件夹中创建班级模型class.ts，数据结构为：ID，班级名称，班级编码，班主任I
logo免费制作：logo免费制作
prezi：prezi
干货|外贸中的丢单利器——拖延式报价！：干货|外贸中的丢单利器——拖延式报价！
亚马逊海卖助手替代工具！：亚马逊海卖助手替代工具！
云南昆明安宁温泉怎么样？好玩吗？：云南昆明安宁温泉怎么样？好玩吗？

Comments

Post a Comment

Popular posts from this blog

指纹浏览器定制开发全面助力企业安全与智能升级

在数字化时代，企业信息安全和智能化管理愈发成为商务发展的两大支柱。为适应这一趋势，指纹浏览器定制开发成为了企业安全和智能升级的最佳选择。让我们一同探索，如何通过指纹浏览器的二次开发、私有部署和AI智能等关键功能，助力企业迎接未来的挑战。 指纹浏览器二次开发：保障身份识别的极致体验 随着科技的不断进步，传统身份验证方式显得越来越脆弱。指纹浏览器的二次开发为企业带来了身份识别的极致体验，通过精准的生物特征验证，极大地提高了安全性。企业无需担忧密码泄漏或仿冒风险，真正实现了信息安全的无忧管理。 私有部署：数据安全掌握在自己手中 数据是企业最重要的资产之一，而私有部署则是最为可靠的数据保护手段之一。通过将指纹浏览器定制开发系统私有部署，企业能够完全掌握对敏感数据的访问和存储。这一层级的掌控，不仅提升了数据的安全性，同时也避免了因为云服务的共享带来的潜在风险。 原文转载： https://fashion.shaoqun.com/a/1585172.html 深圳巴厘岛海景酒店 ：https://www.vstour.cn/t/深圳巴厘岛海景酒店.html 深圳巴厘岛旅行团 ：https://www.vstour.cn/t/深圳巴厘岛旅行团.html 深圳巴厘岛旅游 ：https://www.vstour.cn/t/深圳巴厘岛旅游.html 深圳巴厘岛旅游报价 ：https://www.vstour.cn/t/深圳巴厘岛旅游报价.html 深圳巴厘岛旅游价格 ：https://www.vstour.cn/t/深圳巴厘岛旅游价格.html 深圳巴厘岛旅游团 ：https://www.vstour.cn/t/深圳巴厘岛旅游团.html 红海堵塞，海湾受益？ ：https://www.kjdsnews.com/a/1743053.html 一篇文章带你了解商标注册：尼加拉瓜 ：https://www.kjdsnews.com/a/1743054.html
Read more

跨境电商资讯：一文带你走进亚马逊19大海

Image
随着全球电商行业的迅速发展，许多品牌逐渐将目光投向海外市场，寻找新的业务增长点。亚马逊作为全球最大的电商平台之一，拥有众多海外站点，为卖家提供了广阔的发展空间和优质的服务。然而，当卖家们面对海外众多不同的站点，它们的区别是什么？该选红海站点还是蓝海站点？如何才能选择适合自己的平台？这些都让许多卖家感到非常迷惑，不知所措。 别着急！接下来就让小编带大家一起了解亚马逊各大海外站点的机会优势，并分享几位卖家的实战经验，助您选好出海站点，赢在起跑线！ 目前，亚马逊在全球拥有19大海外站点，覆盖北美、拉丁美洲、欧洲、亚洲、大洋洲等多个地区，帮助卖家触达数亿消费者。这些站点各有"特长"，您可以结合自身业务、资金情况和发展需求等因素，Pick适合自己的出海站点，及时把握海外商机！ 01老牌成熟站点，新手出海首选！ 目前，亚马逊在北美地区拥有美国站和加拿大站两大站点。北美站的整体成熟度和服务完善性让许多卖家将它作为开拓生意的首站。 从宏观环境来看，北美站可谓实力超群： ●体量庞大，消费潜力高 作为亚马逊全球最大海外站点，消费实力强劲，两大站点囊括3.7亿+人口，人红利充足，Prime会员占比高； ●品类齐全，细分赛道机会多 加拿大站选品文化接近美国，选品空间广阔，有利于卖家挖掘不同品类商机! 对于新手来说，亚马逊北美站拥有多重优势助力启航： ●配套完善，服务齐全 作为最早开设的站点，亚马逊服务支持齐全，新卖家上手更轻松 ●物流便捷，配送无阻 您可使用亚马逊远程物流配送计划(NARF)，将美国站FBA库存直接配送给加拿大买家，无需将库存事先运送到加拿大，助您轻松拓展北美地区商业版图! 该计划具有以下4大优势： ●利用美国FBA库存，为加拿大的Prime买家提供免费配送服务； ●由亚马逊处理跨境配送事宜，让配送流程更简单便捷； ●进口税费和相关费用由买家支付，无需卖家承担； ●退货直接退回美国，省心省力。 如果您想坐拥巨大流量，触达更多、更广泛的消费者；如果您的选品种类丰富齐全，希望同时布局多种品类赛道……那么北美站是您不该犹豫的首选! 02高潜消费增长能力，业务拓展不二之选！ 在拉丁美洲，除了已对卖家开放的墨西哥站之外，亚马逊巴西站也于2023年12月正式对中国卖家开放，不少北美站卖家已抢先拓展生意版图，吃到了"第一只螃蟹"! 结合宏观发展趋势...
Read more

利用 Google 购物广告促进销量的初学者指南

您需要更多客户。 并且，您需要 以可接受的成本获取它们 。因为，如果你不能做这两件事呢？ ……好吧， 我们别去那里了 。 首先，如何获得更多客户？ 嗯，一种行之有效的方法是 Google Shopping 。 这一领先的电子商务流量来源 占 电子商务 网站整体销售额的 16% 以上。 那是 巨大的。 但是，当您考虑到Google每秒处理超过 40,000 个搜索查询 时，这也就不足为奇了。 不过，这还不是全部…… 2018 年，在美国电子商务领域，Google 购物广告占 零售搜索广告支出的 76.4% ，占所有付费搜索点击次数的 85.3%。 另一方面，文字广告仅吸引了 23.6% 的零售搜索广告支出和 14.7% 的付费搜索点击次数。 由于 Google 努力通过富媒体广告格式提高知名度，投资 Google Shopping 广告系列已成为零售搜索行业的主要趋势。 但是，您能否使用 Google 购物以可接受的成本获取客户，从而为您带来利润？ 一言以蔽之？ 是的 。 OMG Commerce首席执行官 Brett Curry 去年 管理的广告活动平均 广告支出回报率 (ROAS) 为 300-600% 。 您愿意花 1美元获得 3 至 6 美元的销售额吗？ 我愿意打赌你会的。 你是怎么做到的？ 在本文中，您将准确了解 Google 购物是什么、它的工作原理以及如何开始您的第一个广告系列。 好吧，系好安全带 。 Fansgurus是一个社交媒体营销在线平包含了Facebook，Instagram，Twitter，Pinterest，YouTube，Tiktok，telegram，虾皮等等海外社交媒体，并提供增粉、点赞、转发、评论浏览量直播间在线，网站引流等数据服务。快速体验： zllp.myyfrs.ciwi._okgyw?fyuokfj 什么是谷歌购物？ Google 购物广告也称为产品详情广告或 PLA。而且，当用户在 Google 上搜索产品时，它们就会显示。 它们出现 在搜索结果的顶部或页面的右上角： Google 购物广告也可以 在"购物"标签下找到。 这些广告如此有效的 部分原因 是它们位于搜索结果顶部的显着位置。 那么，Google 购物广告包含哪些内容？ 简而言之， 消费者熟悉的5 个关键组件： 产品图片 产品名称 价格 卖家姓...
Read more