鸿蒙期末项目(4)

news2024/11/15 21:08:35

day4

页面的设计与编写基本完成,接下来使用我们之前搭建好的服务器与相关的网络接口将鸿蒙中的逻辑真正实现一下。

在实现购物车页面展示功能时,使用了如下代码:

getCartList(uid: number): Promise<CartItem[]> {
    return new Promise((resolve, reject) => {
        axios.get(
            `${this.baseUrl}/cart?uid=${uid}`
        )
            .then((resp) => {
            resolve(resp.data)
        })
            .catch((error) => {
            reject(error);
        })
    })
}

结果页面并未加载成功,日志显示错误:

随后通过postman测试服务端,显示返回结果为:

与CartItem类属性进行对比

并未发现差错。

进一步通过console.log发现,错误信息并非来自于axios请求,而是在调用model方法的.catch中被捕获的。这时服务器响应的数据已经正确被axios接收到了。

所以问题应当出现在调用的部分:

aboutToAppear() {
    CartModel.getCartList(CommentConstant.user.id)
        .then((list) => {
        this.productList = list;
        this.evalData(this.productList);
    })
        .catch((error) => {
        console.log(error);
    })
}

在一个偶然的巧合下,我将 this.evalData(this.productList); 注释掉,随后报错消失了。随后我用注释法(注释掉一部分代码看是否还报错)找到了 CartItem 类下的 getProduct() 方法。我使用 new CartItem().gerProduct() 加控制台输出的方式证明了这个方法 的清白 ,然而为什么通过服务器传过来的对象调用这个方法却会报 TypeError 的错呢?

最后的解决办法是从服务器接收数据的时候新创建一个对象,然后把接收对象的属性一条一条放到新对象中在使用。

推测可能的错误原因是,服务器传过来的这个对象仅仅“虚有其表”,仅仅包含了这个类的属性,却没有绑定这个类的方法,所以当尝试调用这个虚有其表的对象的方法时,编译器不会报错,但运行时抛报无法调用的异常。(也许与router传对象参数也无法使用的原因类似?)

最后页面成功显示了数据:

值得一提的是,删除一项时,我最初的想法是将购买数量设为 0,在数据库中添加触发器,当一项变为0后删除该数据:

DELIMITER $$
​
CREATE TRIGGER delete_from_cart_before_update
BEFORE UPDATE ON cart
FOR EACH ROW
BEGIN
   IF NEW.count = 0 THEN
      DELETE FROM cart WHERE uid = NEW.uid AND Did = NEW.Did;
      SIGNAL SQLSTATE '45000' SET MESSAGE_TEXT = 'Row deleted due to count being zero.';
   END IF;
END$$
​
DELIMITER ;

当我后来用postman测试时,数据库报了这样一个错:

我才意识到这是个愚蠢想法:在update触发器中使用delete是大忌,因为delete会重新触发触发器,导致无限循环或更严重的错误。所以还是应当老老实实写delete语句。

关于同步和异步的问题:在声明周期函数中使用异步调用服务器数据是比较常见的行为,当时如果期望取到了第一个数据再请求第二个数据时,有以下两种办法:

  1. 使用await与async将生命周期内部变为同步,但是依然需要注意的是,虽然使用async将aboutToAppear变为异步,但是程序不会等待aboutToAppear内部代码执行完毕再渲染页面,因为拿到aboutToAppear的Promise是一瞬间完成的。

    async aboutToAppear() {
        await 请求1
            .then().catch()
        await 请求2
            .then().catch()
    }

  2. 在一个Promise的then中继续下一个请求,这样可以保证请求的执行是顺序的。缺点是代码较乱。

    aboutToAppear() {
        请求1
            .then(() => {
                请求2
                    .then().catch()
            }).catch()
    }

在查询订单时,需要实现的功能为根据用户编号uid查询所有订单以及订单中第一个商品的信息。使用了较为复杂的多表连结查询和分组查询,使用的sql语句如下:

select store.storeName,dish.sid,orders.state,time,dish.price,dish.dishName,img from orders
join store on orders.sid = store.id
join dish on store.id = dish.sid
join user on orders.uid = user.id
where user.id = 1 and orders.state = 0 and dish.id = (
    select min(dish.id) from dish where dish.sid = store.id
    ) group by store.id;

实际执行时产生报错:

网上的解释为

在Mysql版本为5.7.25时,在使用使用group by 时,会出现Expression #4 of SELECT list is not in GROUP BY clause and contains nonaggregated...错误,这个错误的原因是 group by后面需要加上,select中的所有字段。不然就会报这个错误。

修改并规范后的sql代码

SELECT 
    store.storeName,
    store.id AS sid, -- 明确sid来源并使用AS给列一个别名以避免混淆
    orders.state,
    orders.time, -- 假设time是orders表的列
    dish.price,
    dish.dishName,
    dish.img AS img -- 假设img是store表的列,明确了来源
FROM 
    orders
JOIN 
    store ON orders.sid = store.id
JOIN 
    dish ON store.id = dish.sid AND dish.id = (
        SELECT 
            MIN(dish.id) 
        FROM 
            dish 
        WHERE 
            dish.sid = store.id
    )
JOIN 
    user ON orders.uid = user.id
WHERE 
    user.id = 1 AND orders.state = 0
GROUP BY 
    store.storeName, store.id, orders.state, orders.time, dish.price, dish.dishName, dish.img;

一个订单有可能包含多个商品,由axios将商品信息一个一个传递给服务端无疑是最低效的方法。而将所有数据一次性传递给服务器端,则需要使用post请求,将传递的商品信息放在TCP报文的数据段。这就要求了服务器需要能够处理 json 数据并具备一次性插入多条数据至数据库的功能。

该功能可以使用xml字符串拼接完成:

@Insert("<script> " +
            "insert into od " +
            "values " +
            "<foreach collection=\"items\" index=\"index\" item=\"item\" separator=\",\"> " +
            "(#{item.Oid},#{item.Did},#{item.count})" +
            "</foreach> " +
            "</script>")
    public int insertOD(@Param("items") List<Od> items);

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1869709.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

嵌入式框图、流程图绘制软件常用推荐

框图、流程图绘制软件介绍 1. ioDraw Create diagrams, Flowchart, Mindmap freely onlineioDraw is an easy-used free online diagramming application to create multiple diagrams, flowcharts,mindmaps, UML,UI sketches, etc.https://www.iodraw.com/diagram/ 功能&…

掌握SEO:如何优化用ChatGPT生成的文章以提升搜索排名

在数字化时代&#xff0c;搜索引擎优化&#xff08;SEO&#xff09;已经成为网站流量的重要来源。随着人工智能技术的进步&#xff0c;越来越多的人开始使用ChatGPT等AI工具来生成文章。然而&#xff0c;虽然这些工具可以快速生成内容&#xff0c;但要确保这些内容在搜索引擎中…

【光伏开发】工商业光伏的优势

随着全球对可再生能源的日益重视和环保意识的增强&#xff0c;工商业光伏作为一种清洁、高效的能源利用方式&#xff0c;正在得到广泛的推广和应用。工商业光伏系统通过安装在工厂、仓库、办公楼等工商业场所的太阳能电池板&#xff0c;将太阳能转化为电能&#xff0c;以满足工…

PID算法介绍以及代码实现过程说明

写在正文之前 在上一篇文章就说会在这两天会基于PID写一个文章&#xff0c;这里的原理部分值得大家都看一下&#xff0c;代码部分的实现是基于python的&#xff0c;但是对于使用其他编程语言的朋友&#xff0c;由于我写的很通俗易懂&#xff0c;所以也值得借鉴。 一、PID算法…

AR导航技术加持,图书馆阅读体验智慧升级

在信息爆炸的今天&#xff0c;图书馆作为知识的宝库&#xff0c;其藏书量和种类日益增多。然而&#xff0c;传统的图书馆导航方式已逐渐无法满足用户对快速、准确定位图书的需求。本文将探讨图书馆AR地图导航的实现原理、技术优势、功能特点以及市场前景&#xff0c;揭示为何AR…

【C++】——AVL树(详细解读)

目录 一 AVL树的概念 二 AVL树节点的定义 三 AVL树的插入 1.先和搜索二叉树一样&#xff0c;去找插入的结点 2.插入的时候&#xff0c;需要更新平衡因子 3.确定平衡因子的改变&#xff0c;判断AVL树的改变 三 AVL树的旋转 左单旋 右单旋 右左双旋 左右双旋 四 …

【包邮送书】深度学习与信号处理

欢迎关注博主 Mindtechnist 或加入【智能科技社区】一起学习和分享Linux、C、C、Python、Matlab&#xff0c;机器人运动控制、多机器人协作&#xff0c;智能优化算法&#xff0c;滤波估计、多传感器信息融合&#xff0c;机器学习&#xff0c;人工智能等相关领域的知识和技术。关…

计算机等级考试二级Java-第一篇:Java语言概述

1.java语言的历史和发展 1991年由sun公司的James Gosling负责开发的&#xff0c;一个分布式代码系统&#xff08;Oak),最初是为家用消费电子产品&#xff08;电冰箱&#xff0c;电视机等&#xff09;进行编程&#xff0c;它是java语言的前身。 1994年sun公司件目标市场转向In…

热敏晶振:成本效益的选择与温补晶振的比较

在精密电子系统的设计中&#xff0c;晶振作为时间基准源&#xff0c;其频率稳定性直接影响到整个系统的性能。其中&#xff0c;温补晶振(Temperature Compensated Crystal Oscillator&#xff0c;简称TCXO)与热敏晶振(Thermistor Compensated Crystal Oscillator)作为在特殊温度…

VS studio2019配置远程连接Ubuntu

VS studio2019配置远程连接Ubuntu 1、网络配置 &#xff08;1&#xff09;获取主机IP &#xff08;2&#xff09;获取Ubuntu的IP &#xff08;3&#xff09;在 windows 的控制台中 ping 虚拟机的 ipv4 地址&#xff0c;在 Ubuntu 中 ping 主机的 ipv4 地址。 ubuntu: ping…

centos7 安装单机MongoDB

centos7安装单机 yum 安装 1、配置yum源 vim /etc/yum.repos.d/mongodb.repo [mongodb-org-7.0] nameMongoDB Repository baseurlhttps://repo.mongodb.org/yum/redhat/$releasever/mongodb-org/7.0/x86_64/ gpgcheck1 enabled1 gpgkeyhttps://www.mongodb.org/static/pgp…

1.3.1 离散周期信号DFS

目录 离散周期序列的DFS表示 离散周期信号DFS的性质 线性特性 位移特性 对称特性 奇偶对称 共轭反转对称 实序列的对称特性 周期卷积 DFS——Discrete Fourier Series 傅里叶级数 离散周期序列的DFS表示 做题得到的小公式 离散周期信号DFS的性质 线性特性 位…

【日志等级类编写】

日志等级类编写 这篇文章接着上篇文章&#xff0c;继续来完成日志系统。 在一个日志文件当中&#xff0c;有各种各样的等级日志 debuginfowarnerrorfatal 我们使用的时候传入的是一个等级&#xff0c;我们需要将它转换为字符串。 class LogLevel {public:enum class Level…

白敬亭章若楠甜度报表的难哄大师

#白敬亭章若楠&#xff0c;甜度爆表的难哄大师#&#x1f389;&#x1f389;&#x1f389;各位小伙伴们&#xff0c;你们还记得那个让我们心跳加速、嘴角上扬的CP组合吗&#xff1f;没错&#xff0c;就是白敬亭和章若楠&#xff01;他们可是凭借一部新剧&#xff0c;再次让我们感…

分享几个小红书获取笔记详情API接口调用实例

item_get_video-获得小红书笔记详情 smallredbook.item_get_video 公共参数 名称类型必须描述keyString是调用key&#xff08;API支持测试&#xff0c;获取测试key&#xff09;secretString是调用密钥api_nameString是API接口名称&#xff08;包括在请求地址中&#xff09;[i…

第1章 基础知识

第1章 基础知识 1.1 机器语言 机器语言就是机器指令的集合&#xff0c;机器指令展开来讲就是一台机器可以正确执行的命令 1.2 汇编语言的产生 汇编语言的主题是汇编指令。汇编指令和机器指令的差别在于指令的表示方法上&#xff0c;汇编指令是机器指令便于记忆的书写格式。…

技术干货|SimLab 电子产品热流体仿真

电子产品热仿真特点有哪些&#xff1f; 结构复杂&#xff0c;电子设备包含几十~上千个元器件 体积小&#xff0c;功率密度高、关注热敏感元器件 多种冷却方式&#xff0c;自然冷却、风扇冷却、液冷、热管等 多维度&#xff0c;芯片级&#xff0c;板级&#xff0c;系统级 单…

纯干货丨知乎广告投放流程和避坑攻略

精准有效的广告投放企业获客的关键&#xff0c;知乎作为中国最大的知识分享平台&#xff0c;拥有着高质量的用户群体和高度的用户粘性&#xff0c;为广告主提供了独一无二的品牌传播与产品推广平台。然而&#xff0c;如何在知乎上高效、精准地进行广告投放&#xff0c;避免不必…

恭喜!Z医生喜提世界名校—斯坦福大学访问学者邀请函

➡️【院校简介】 斯坦福大学&#xff08;Stanford University&#xff09;&#xff0c;全称为小利兰斯坦福大学&#xff0c;简称“斯坦福”&#xff0c;位于美国加州旧金山湾区南部帕罗奥多市境内&#xff0c;临近高科技园区硅谷&#xff0c;是私立研究型大学&#xff0c;全球…

nbcio-vue升级迁移flowable到最新的jeeg-boot-vue3的问题记录(二)

因为这个项目license问题无法开源&#xff0c;更多技术支持与服务请加入我的知识星球。 8、用生成的代码修改api与列表字段&#xff0c;但还是显示不出来&#xff0c;api获取数据是正常的 使用BasicTable的api的时候&#xff0c;调用的api不能 // 我的发起的流程 export cons…