钩子函数onMounted定义了太多访问MySQL的操作 导致数据库异常

先放几种后端遇到的异常,多数和数据库有关

pymysql.err.InternalError: Packet sequence number wrong - got 102 expected 1
127.0.0.1 - - [09/May/2024 17:49:37] "GET /monitorLastTenList HTTP/1.1" 500 
AttributeError: 'NoneType' object has no attribute 'read'
127.0.0.1 - - [09/May/2024 17:49:37] "GET /alarmTotal HTTP/1.1" 500 -
使用pymysql报错err.ProgrammingError: execute() first

异常代码如下:

onMounted(() => {
  // getList();
  // getPeopleTotal().then(({ data }) =>{
  //   // 更新人数总量
  //   peopleTotal.value = data.total;
  // })
  getPeopleTotal().then(response => {
    // 打印请求返回的数据
    console.log('Total people count:', response.data);
    // 更新人数总量
    peopleTotal.value = response.data.total;
  }).catch(error => {
    console.error('Error fetching total people count:', error);
  });
  getJieKouTotal().then(response => {
    // 打印请求返回的数据
    console.log('Total JieKou count:', response.data);
    // 更新调用接口总量
    jieKouTotal.value = response.data.total;
  }).catch(error => {
    console.error('Error fetching total JieKou count:', error);
  });
  getTimeTotal().then(response => {
    // 打印请求返回的数据
    console.log('Total Time count:', response.data);
    // 更新时间总量
    timeTotal.value = response.data.total;
  }).catch(error => {
    console.error('Error fetching total Time count:', error);
  });
  getAlarmTotal().then(response => {
    // 打印请求返回的数据
    console.log('Total alarm count:', response.data);
    // 更新预警总量
    alarmTotal.value = 100;
  }).catch(error => {
    console.error('Error fetching total alarm count:', error);
  });
  getMonitorLastTenList().then(response => {
    // 打印请求返回的数据
    console.log('Total monitor count:', response.data);
    // 更新监控总量
    monitordataList.value = response.data.dataList;
    // 更新车流量预警统计图表数据
    carFlow.series[0].data = monitordataList.value;
  }).catch(error => {
    console.error('Error fetching total monitor count:', error);
  });
  getClassList().then(response => {
    // 打印请求返回的数据
    console.log('Total class count:', response.data);
    // 更新监控总量
    carCount.value = response.data.dataList[0];
    busCount.value = response.data.dataList[1];
    vanCount.value = response.data.dataList[2];
    // 更新饼状图数据
    pieChartData = [
      { value: carCount.value, name: '小汽车' },
      { value: vanCount.value, name: '厢式货车' },
      { value: busCount.value, name: '公交车' },
    ];
    category.series[0].data = pieChartData

  }).catch(error => {
    console.error('Error fetching total class count:', error);
  });
})

修改毕设vue代码,很多知识已经忘掉了,全程和gpt一起找bug,最后也没问出来什么,分析了一下应该是同时访问数据库次数太多了,让gpt帮忙修改了一下。

我:怎么让这几个函数一个一个的执行,否则会经常数据库异常
gpt: 你可以使用 JavaScript 中的 Promise 链来确保这些函数按顺序执行,并在前一个函数执行成功后再执行下一个函数。下面是一个示例代码,展示了如何使用 Promise 链来实现:

onMounted(() => {
  getPeopleTotal()
    .then(response => {
      console.log('Total people count:', response.data);
      peopleTotal.value = response.data.total;
      return getJieKouTotal(); // 返回一个 Promise 对象,使得下一个函数能够等待当前函数执行完毕后再执行
    })
    .then(response => {
      console.log('Total JieKou count:', response.data);
      jieKouTotal.value = response.data.total;
      return getTimeTotal();
    })
    .then(response => {
      console.log('Total Time count:', response.data);
      timeTotal.value = response.data.total;
      return getAlarmTotal();
    })
    .then(response => {
      console.log('Total alarm count:', response.data);
      alarmTotal.value = 100;
      return getMonitorLastTenList();
    })
    .then(response => {
      console.log('Total monitor count:', response.data);
      monitordataList.value = response.data.dataList;
      carFlow.series[0].data = monitordataList.value;
      return getClassList();
    })
    .then(response => {
      console.log('Total class count:', response.data);
      carCount.value = response.data.dataList[0];
      busCount.value = response.data.dataList[1];
      vanCount.value = response.data.dataList[2];
      pieChartData = [
        { value: carCount.value, name: '小汽车' },
        { value: vanCount.value, name: '厢式货车' },
        { value: busCount.value, name: '公交车' },
      ];
      category.series[0].data = pieChartData;
    })
    .catch(error => {
      console.error('Error fetching data:', error);
    });
});

完美解决!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

BS-Diff | 扩散模型在骨抑制任务上的首次登场!

摘要 胸部 X 射线(CXR)是肺部筛查中常用的低剂量方式。然而,由于大约 75% 的肺部区域与骨骼重叠,这反过来又阻碍了疾病的检测和诊断,因此 CXR 的功效受到了一定程度的影响。作为一种补救措施,骨抑制技术已…

泛域名SSL证书购买攻略!

购买泛域名证书(也称为通配符证书)通常涉及以下几个步骤: 1. 选择证书提供商: 首先,你需要选择一个信誉良好的SSL证书提供商,如 Sectigo、GlobalSign、DigiCert 或者JoySSL。部分云服务提供商如华为云也提供…

冒泡排序----深刻理解版本

前面虽然向大家介绍了冒泡排序,但是表达的不是很清楚,这次我带着更深刻的理解向大家介绍以下冒泡排序。 1.冒泡排序 冒泡排序其实是一种排序算法,通过数据之间的相互比较将一堆混乱的数据按照升序或者降序的顺序排列。 2.解题思路 解题思…

【人工智能基础】GAN与WGAN实验

一、GAN网络概述 GAN:生成对抗网络。GAN网络中存在两个网络:G(Generator,生成网络)和D(Discriminator,判别网络)。 Generator接收一个随机的噪声z,通过这个噪声生成图片…

解决uniapp软键盘弹起导致页面fixed定位元素被顶上去

在移动端开发中通常导航栏需要固定在页面的最顶端,但当页面中有输入框且dom元素较多时,点击输入框弹出软键盘会促使导航栏往上移 正常情况如图一所示,软键盘弹起如图二所示 图一 图二 解决办法 1)给输入框添加 :adjust-position…

李飞飞团队 AI4S 最新洞察:16 项创新技术汇总,覆盖生物/材料/医疗/问诊……

不久前,斯坦福大学 Human-Center Artificial Intelligence (HAI) 研究中心重磅发布了《2024年人工智能指数报告》。 作为斯坦福 HAI 的第七部力作,这份报告长达 502 页,全面追踪了 2023 年全球人工智能的发展趋势。相比往年,扩大了…

node.js 下载安装 配置环境变量

1 官网下载 需要的版本https://nodejs.org/dist 下载 .msi的文件 2 根据安装向导,安装 3 检查安装 是否成功,winr 输入cmd,输入node --version 回车,查看版本 4 配置换进变量 node路径是 安装时 的安装路径 5 vscode 启动项目…

HTML(3)——常用标签3

引用标签 1.<blockquote>和<q> 两者都是对文本的解释引用&#xff0c;<blockquote>是用较大的段落进行解释&#xff0c;<q>是对较小的段落进行解释。 <!DOCTYPE html> <html lang"en"> <head><meta charset"UT…

【小浩算法 BST与其验证】

BST与其验证 前言我的思路思路一 中序遍历判断数组无重复递增思路二 递归边界最大值最小值的传递 我的代码测试用例1测试用例2 前言 BST是二叉树一个经典应用&#xff0c;我们常常将其用于数据的查找以及构建平衡二叉树等。今天我所做的题目是验证一颗二叉树是否为二叉搜索树&…

基于PHP高考志愿填报系统搭建私有化部署源码

金秋志愿高考志愿填报系统是一款为高中毕业生提供志愿填报服务的在线平台。该系统旨在帮助学生更加科学、合理地选择自己的大学专业和学校&#xff0c;从而为未来的职业发展打下坚实的基础。 该系统的主要功能包括:报考信息查询、志愿填报数据指导、专业信息查询、院校信息查询…

学习CSS3动画教程:手把手教你绘制跑跑卡丁车

学习之前&#xff0c;请先听一段音乐&#xff1a;等登&#xff0c;等登&#xff0c;等登等登等登&#xff01;没错&#xff0c;这就是我们当年玩的跑跑卡丁车的背景音乐&#xff0c;虽然后来有了QQ飞车&#xff0c;但还是更喜欢跑跑卡丁车&#xff0c;从最初的基础板车&#xf…

深入入IAEA底层LinkedList

✅作者简介&#xff1a;大家好&#xff0c;我是再无B&#xff5e;U&#xff5e;G&#xff0c;一个想要与大家共同进步的男人&#x1f609;&#x1f609; &#x1f34e;个人主页&#xff1a;再无B&#xff5e;U&#xff5e;G-CSDN博客 目标&#xff1a; 1.掌握LinkedList 2.…

好用无广告的快捷回复软件

在现在的工作环境中&#xff0c;时间就是金钱。对于客服人员来说&#xff0c;能够快速而准确地回复客户的问题&#xff0c;是提高工作效率和客户满意度的关键。因此&#xff0c;一个实用的快捷回复工具是必不可少的。今天&#xff0c;我想向大家推荐一款好用且无广告的客服快捷…

三勾软件 / 三勾点餐系统门店系统,java+springboot+vue3

项目介绍 三勾点餐系统基于javaspringbootelement-plusuniapp打造的面向开发的小程序商城&#xff0c;方便二次开发或直接使用&#xff0c;可发布到多端&#xff0c;包括微信小程序、微信公众号、QQ小程序、支付宝小程序、字节跳动小程序、百度小程序、android端、ios端。 在…

2024年受欢迎的主流待办事项提醒软件推荐

随着科技的飞速发展&#xff0c;2024年的今天&#xff0c;众多优秀软件如雨后春笋般涌现&#xff0c;极大地便利了我们的生活与工作。其中&#xff0c;待办事项提醒软件尤为受欢迎&#xff0c;它们不仅能记录日常待办任务&#xff0c;还能在关键时刻提醒我们及时处理&#xff0…

1707jsp电影视频网站系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 JSP 校园商城派送系统 是一套完善的web设计系统&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统采用web模式&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数…

使用 SSH 连接 GitHub Action 服务器

前言 Github Actions 是 GitHub 推出的持续集成 (Continuous integration&#xff0c;简称 CI) 服务它提供了整套虚拟服务器环境&#xff0c;基于它可以进行构建、测试、打包、部署项目&#xff0c;如果你的项目是开源项目&#xff0c;可以不限时使用服务器硬件规格&#xff1…

(1)AB_PLC Studio 5000软件与固件版本升级

AB_PLC Studio 5000软件与固件版本升级 1. 软件版本升级2. 固件版本升级1. 软件版本升级 使用将老程序从19版本升级到33版本。 step1:双击程序.ACD文件,打开界面如下。 step2:点击更改Controller,选择我们的新CPU的型号和版本号。点击确定 step3:点击确定,等待。 st…

echart 多表联动value为null时 tooltip 显示问题

两个图表&#xff0c;第一个有tooltip,第二个隐藏掉 两个图表的 series 如下 // ----- chart1 ----series: [{name: Union Ads,type: line,stack: Total,data: [320, 282, 391, 334, null, null, null],},{name: Email,type: line,stack: Total,data: [220, 232, 221, 234, 29…

[YOLOv8] 用YOLOv8实现指针式圆形仪表智能读数(三)

最近研究了一个项目&#xff0c;利用python代码实现指针式圆形仪表的自动读数&#xff0c;并将读数结果进行输出&#xff0c;若需要完整数据集和源代码可以私信。 目录 &#x1f353;&#x1f353;1.yolov8实现圆盘形仪表智能读数 &#x1f64b;&#x1f64b;2.表盘智能读数…
最新文章