uniapp引入ucharts组件不显示

官网说明:

uCharts官网 - 秋云uCharts跨平台图表库

自行封装组件不显示问题

在自行封装组件的过程中经常遇到的问题就是不显示问题,很多开发者把官网【演示】中的【原生】代码直接变成组件引用,这样的作法是错误的。我们在指南中的《组件概述》章节已经详细介绍过为何使用官方组件,我们相信您有实力和能力自行封装,但也请您相信我们多年专业的经验,如果您仍需自行封装,请注意以下问题:

  1. 官网【演示】中的【原生】代码,初始化方法是从onReady()开始执行,而组件没有这个生命周期,请参考各平台的组件生命周期来确定组件初始化的方法。
  2. 执行实例化 new uCharts(opts) 前,请一定确保在子组件完全挂载之后执行,否则会导致 dom 没有加载完毕就进行了渲染,必然会导致图表不显示的问题。
  3. 如果使用 canvas2d 的方式,一定要注意获取 context 的方式的区别,具体详见各平台的原生文档。

解决方式:

我们将官网给出的例子里面的onReady(),换成我们开发的平台的生命周期即可,

例如我正在开发vue2+uniapp,我可以换成mounted()。

相关推荐
CHB2 天前
别再问uni-app x蒸汽模式是否成熟了,已经有大量App案例上架应用商店了
uni-app
anyup4 天前
uView Pro X 1.0.0 发布:全面支持 uni-app x 蒸汽模式,80+ 组件
前端·uni-app·ai编程
zhongben123_4 天前
从零开发一个打车APP:技术选型、系统架构与成本评估指南
大数据·运维·ios·系统架构·uni-app·web app
天蒙蒙亮5 天前
打安卓apk包+“应用商城”发布
前端·uni-app
ModyQyW5 天前
vite-plugin-uni-pages 0.6:统一扫描规则,开发期少重启
前端·uni-app
Software攻城狮5 天前
【uniapp和普通web 端开发的区别】
前端·uni-app·notepad++
2501_915921435 天前
iOS 实时日志怎么看?KeyMob 的日志过滤、崩溃报告与符号化
android·ios·小程序·https·uni-app·iphone·webview
郑州光合科技余经理6 天前
同城小程序开发:同一笔单在用户端和商家端各显示到哪
android·java·开发语言·前端·后端·uni-app·php
普通人66 天前
uniapp模版JS
开发语言·javascript·小程序·uni-app·1024程序员节
wiseyao12196 天前
uniapp scroll-view滚动到最后
前端·javascript·uni-app