uniapp微信小程序开发踩坑日记:由于图表数据渲染不出来,我第一次在项目中用watch函数监听数据变化

一、发现问题

在我们团队自己开发的微信小程序中,引入了Echarts图表库

然后突然有一天,后端队友反应图表渲染有问题。后面我去试了一下,确实20次里面必有一次数据渲染不出来

 

断定代码没问题,于是我们将其鉴定为玄学

 

二、问题原因

后面我冷静下来有仔细分析了下代码,找到了图表渲染问题的原因

虽然我开发用的是Vue项目,Vue的数据是响应式的,但是Echarts图表的底层是JS实现的,图表的数据并不是响应式的

所以有时候后端数据还没返回,图表就已经渲染好了,那时候数据还是空

三、解决问题

要用watch来监听数据变化,等数据从空变为有值的时候再渲染图表

于是我写了如下代码

对了,别忘记import {  watch  } from "vue" ,我一开始忘了加,导致代码报错了

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

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

相关文章

VS2022 配置OpenCV开发环境详细教程

OpenCV OpenCV(Open Source Computer Vision Library)是一个开源的计算机视觉和机器学习软件库,由Intel开发并首先发布于1999年。OpenCV被广泛用于实时图像处理、视频分析、物体检测、面部识别、机器人视觉以及许多其他领域。它支持C、Pytho…

代码+视频,R语言绘制生存分析模型的时间依赖(相关)性roc曲线和时间依赖(相关)性cindex曲线

ROC曲线分析是用于评估一个因素预测能力的手段,是可以用于连续型变量分组的方法。在生存分析中,疾病状态和因素取值均会随时间发生变化。而标准的ROC曲线分析将个体的疾病状态和因素取值视作固定值,未将时间因素考虑在分析之中。在这种情况下…

STM32入门_江协科技_1~2_OB记录的自学笔记_STM32简介

1.综述 1.1. 课程简介 手打代码是加入了实操,增加学习效果; STM最小系统板面包板的硬件平台; 配套0.96寸的显示屏,便于调试; 因为使用面板板,所以如果程序现象不出来也有可能是硬件连接的问题; …

Linux 小技巧1

目录 一. 统计文件的总行数二. 获取从第二行开始的内容三. 合并两个文件为一个文件四. 统计指定列唯一值的数量五. 列出文件的绝对路径六. 获取除了空白行和注释之外的部分 一. 统计文件的总行数 ⏹非压缩文件 统计当前文件夹下csv文件的行数 wc -l ./*.csv统计指定文件夹下…

甘特图是什么?利用甘特图来优化项目管理流程

在现代项目管理中,图表是一种强大而直观的工具,可以帮助项目经理和团队成员清晰地了解并掌控整个项目进程。其中,甘特图是最常用和最有效的图表之一。 甘特图是一种条形图,可以用来直观地展示项目中各个任务的进度、持续时间和相互关系。它由一个横轴和一个纵轴组成。横轴代表时…

基于单片机的多功能电子万年历系统

摘要:该题目要求学生综合运用单片机原理、低频电子线路、数字电路与逻辑设计等相关知识,设计完成多功能电子万年历系统。通过完成设计任务,使学生掌握单片机设计开发的基本流程,增强学生动手实践能力,培养学生分析和解决实际问题的能力,为后续课程的学习和工作打下良好基础。 关…

【c++】----STL简介string

目录 1. 什么是STL 2. STL的版本 3. STL的六大组件 4.STL的缺陷 5.string类 1. 为什么学习string类? 6.string类的常用接口说明(下面我们只讲解最常用的接口) 1.string 常见构造 2.string类的遍历 iterator 迭代器遍历 (…

初识BootStrap

目录 前言: 1.Bootstrap的特点包括: 1.1响应式设计: 1.2组件丰富: 1.3易于定制: 1.4兼容性良好: 1.5强大的社区支持: 1.6一致的样式和布局: 1.7 插件和扩展性 2.初识Ajax: 2.1同步请求…

STM32应用开发教程进阶--Wi-Fi通信(ESP8266模块:STA、AP、STA+AP)

实现目标 1、熟悉Wi-F、ESP8266模块 2、掌握ESP8266模块共3种工作模式:STA、AP、STAAP的配置 3、具体实现目标:(1)AT固件烧录;(2)ESP8266模块STA、AP、STAAP的配置 一、Wi-Fi概述 1、Wi-Fi定…

【kettle006】kettle访问华为openGauss高斯数据库并处理数据至execl文件

1.一直以来想写下基于kettle的系列文章,作为较火的数据ETL工具,也是日常项目开发中常用的一款工具,最近刚好挤时间梳理、总结下这块儿的知识体系。 2.熟悉、梳理、总结下华为openGauss高斯数据库相关知识体系 3.欢迎批评指正,跪谢…

【实时数仓架构】方法论(未完)

笔者不是专业的实时数仓架构,这是笔者从其他人经验和网上资料整理而来,仅供参考。写此文章意义,加深对实时数仓理解。 实时数仓背景和场景 一、实时数仓架构技术演进 1.1、四种架构演进 1)离线大数据架构 一种批处理离线数据分…

电脑开机后卡在开机LOGO画面如何排查处理

当电脑开机后长时间停滞在开机LOGO画面,无法继续进入操作系统,这一现象常令用户困扰不已。本文将深入探讨导致此类问题的多种可能原因,并提供相应的解决方法,帮助你有效地诊断和排除故障。 硬件故障或接触不良 1. 硬盘问题:硬盘是系统启动的关键组件,其故障或数据线接触…

Django项目之电商购物商城 -- 校验用户输入密码是否合法

Django项目之电商购物商城 – 校验用户输入密码是否合法 需要开发文档和前端资料的可私聊 一. 创建用户逻辑操作 1. 创建用户app – users python manage.py startapp users2.注册app users.apps.UsersConfig,3. 创建视图 from django.shortcuts import render from djan…

原生IP和住宅IP有什么区别?

原生IP和住宅IP在多个方面存在显著的区别。 从定义和来源来看,原生IP是指未经NAT(网络地址转换)处理的真实、公网可路由的IP地址,它直接从互联网服务提供商(ISP)获得,而不是通过代理服务器或VP…

Django初步了解

目录 一、什么是Django 二、Django的设计模式 三、涉及的英文缩写及其含义 四、安装(官方教程) 一、什么是Django Django是一个Python Web框架,可以快速开发网站,提供一站式的解决方案,包括缓存、数据库ORM、后台…

大象机器人开源协作机械臂myCobot 630 全面升级!

1. 开篇概述 在快速发展的机器人技术领域中,Elephant Robotics的myCobot 600已经证明了其在教育、科研和轻工业领域的显著适用性。作为一款具备六自由度的机械臂,myCobot 600以其600mm的工作半径和2kg的末端负载能力,满足了多样化的操作需求。…

中间件解析漏洞

1 、 apache 解析漏洞 漏洞环境搭建 下载 vulhub git clone https://github.com/vulhub/vulhub.git 进入对应漏洞目录、 cd vulhub/httpd/apache_parsing_vulnerability apt-get docker-compose 启动漏洞环境 docker-compose up -d 注:启动容器时&#xf…

用数据检验函数正确性,matlab2C

数据存取格式 filename1 g.txt; fid1 fopen(filename1,w); for i 1 : length(g)for j1:size(g,2)if(j1)fprintf(fid1,{%.16f,,g(i,j)); elseif(j>1&&j<151)fprintf(fid1,%.16f,,g(i,j)); elsefprintf(fid1,%.16f},\n,g(i,j));endend%fprintf(fid1,\n…

ZooKeeper 环境搭建详细教程之三(真集群)

ZooKeeper 搭建详细步骤之三(真集群) ZooKeeper 搭建详细步骤之二(伪集群模式) ZooKeeper 搭建详细步骤之一(单机模式) ZooKeeper 及相关概念简介 真集群搭建 搭建 ZooKeeper 真集群涉及多个步骤,包括准备环境、配置文件设置、启动服务以及验证集群状态。 以下是一个简…

在java项目中使用QQ邮箱发送验证码邮件

第一步&#xff1a;集成邮箱服务 在一个java项目中需要一个邮件服务来发送邮件可以使用JavaMail API来实现这一点&#xff0c;在这之前需要在项目中导入javax.mail.jar写入依赖。 方法一&#xff1a;直接在Maven中写入依赖 <dependency><groupId>org.apache.commo…