Vue2全家桶搭建简单的桌面和移动端分离的购物商城
发布日期:2022-03-03 10:44:10 浏览次数:12 分类:技术文章

本文共 3651 字,大约阅读时间需要 12 分钟。

在线预览地址

桌面端:

移动端:

子曰:不想写前端的后端不是好测试,作为一个后端开发感到亚历山大。

最近由于疫情防控需求在家隔离,趁此机会复习一遍Vue知识,顺便做个小项目练练手。

本项目技术栈

移动端基于 Vue2 + Vuex + Axois + MintUI 开发

桌面端基于 Vue2 + Vuex + Axois + ElementUI 开发

后端基于 Mysql + Node + Koa2 + Sequelize5 开发

//引入db配置const db = require('../config/sqz_db')//引入sequelize对象const Sequelize = db.sequelize//引入数据表模型const CommentModel = Sequelize.import('../model/comment_model')const ReplyModel = Sequelize.import('../model/reply_model')const UserModel = Sequelize.import('../model/user_model')// comment表与reply表根据cId关联查询ReplyModel.belongsTo(CommentModel, {    as: 'replies',    foreignKey: 'comment_id',    targetKey: 'id'});CommentModel.hasMany(ReplyModel, {    foreignKey: 'comment_id',    sourceKey: 'id',    as: "replies"});// comment and userCommentModel.hasOne(UserModel, {    foreignKey: 'id',    as: 'user',     targetKey: 'from_id'});//数据库操作类class CommentService {    static async create(data) {        return await CommentModel.create(data);    }    static async findList(params) {        // 前台可能会传来nickname、account来模糊查询,以及分页参数        const id = params.id;        const product_id = params.product_id;        const user_id = params.user_id;        const start = params.start || 0;        const page_size = params.page_size || 10;        // where条件接受一个对象传入,先定义一个对象,用{}符号        let criteria = {};        // 检查前台传来的参数是否为空,从而构造各种查询条件        if (id) {            criteria['id'] = id;        }        if (product_id) {            // 这里后面赋值的是like操作符,代表模糊查询,后面account用``反引号字符串替换模板将account代入进去            criteria['product_id'] = product_id;        }        if (user_id) {            // 这里后面赋值的是like操作符,代表模糊查询,后面account用``反引号字符串替换模板将account代入进去            criteria['user_id'] = user_id;        }        return await CommentModel.findAndCountAll({            where: criteria, // 这里传入的是一个查询对象,因为我的查询条件是动态的,所以前面构建好后才传入,而不是写死            offset: start, // 前端分页组件传来的起始偏移量            limit: Number(page_size), // 前端分页组件传来的一页显示多少条            include: [{ // include关键字表示关联查询                model: ReplyModel, // 指定关联的model                as: 'replies', // 由于前面建立映射关系时为class表起了别名,那么这里也要与前面保持一致,否则会报错                // attributes: ['from_id', 'to_id'], // 这里的attributes属性表示查询class表的name和rank字段,其中对name字段起了别名className            },            { // include关键字表示关联查询                model: UserModel, // 指定关联的model                as: 'user', // 由于前面建立映射关系时为class表起了别名,那么这里也要与前面保持一致,否则会报错                // attributes: ['username', 'password'], // 这里的attributes属性表示查询class表的name和rank字段,其中对name字段起了别名className            }],            raw: true // 这个属性表示开启原生查询,原生查询支持的功能更多,自定义更强        });    }}module.exports = CommentService;

参考项目

未完待续...

转载地址:https://blog.csdn.net/yangjiegang8/article/details/104873543 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:oracle设置字母大小写不敏感对impdp无效
下一篇:俄罗斯方块小游戏的H5和Android版

发表评论

最新留言

不错!
[***.144.177.141]2024年03月11日 23时05分39秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章

函数传参字典_Python新手上车17:函数传递任意多个参数 2021-06-24
去掉数组最后一个元素_【一天一大 lee】在排序数组中查找元素的第一个和最后一个位置 (难度:中等) Day20201201... 2021-06-24
秦九韶算法递推公式_算法讲解之复杂度分析 2021-06-24
添加绝对路径_网站中如何添加绝对路径 2021-06-24
python房价数据分析波士顿代码数据_python数据分析-波士顿房价预测-Go语言中文社区... 2021-06-24
redis线程阻塞原因排插_Redis阻塞原因详解 2019-04-21
labview自动保存报表_基于LabVIEW的Excel报表的自动生成功能 2019-04-21
geotool 导出shp_Java 读取shape文件 2019-04-21
mysql 关联更新_MySQL UPDATE多表关联更新 2019-04-21
mysql call_mysql的call用法 call调用函数的例子 2019-04-21
python参数验证_参数验证,Python中的最佳实践 2019-04-21
python画多层网络_在pymn中修改多层网络图 2019-04-21
java net 安卓_android -------- java.net.UnknownServiceException 2019-04-21
java 密钥 aes 解密_Java中AES加密解密以及签名校验 2019-04-21
java树转化成图_Java 转换一组数据为树型数据 2019-04-21
java 底层ppt_Java 如何设置 PPT 中的形状排列方式 具体内容 2019-04-21
mysql service5.7_Mysql5.7服务下载安装 2019-04-21
mysql查看线程完整执行命令_MySQL-查看运行的线程-SHOW PROCESSLIST 2019-04-21
mysql 更新数据 字符串_批量替换 MySQL 指定字段中的字符串 2019-04-21
web开发 mysql安装_mysqlinstallerwebcommunity5.7.21.0.msi安装图文教程 2019-04-21