2022-10-27 关于uniapp小程序使用echarts-for-weixin过程中,初始化图表this.selectComponent为null的问题
前言:wepy小程序项目转uniapp小程序,在做图表的业务时,出现了如题目所言的问题。
原因:编译后的xxx.json文件中的usingComponents没有引入你的echarts-for-weixin组件。
原因排查过程这里先不记录,总的而言我认为是uniapp在编译的时候没有把echarts-for-weixin编译到小程序的dist包里面,从而导致this.selectComponent拿不到值。
解决方案:如果是,这里有个前提,如果是你的情况和我上面说的一致,那么你可以尝试一下手动在你的业务代码中添加上echarts-for-weixin。
举个例子:
xxx.json
{ "usingComponents": { "ec-canvas": "/components/ec-canvas/echarts" } }
不要以为这就结束了,你会发现你重新编译小程序后,这段代码又消失了,是的它被删除了。
最后:你还得把echarts-for-weixin的包放在小程序的dist里面;以上修改均在小程序的dist包里面修改。
最后的最后:wepy项目编译小程序打包就没问题,转成uniapp后,这个echarts-for-weixin包反倒不能被编译过去了。
=================================若干分钟后=============================================
关于uni为什么没有把echarts-for-weixin编译到微信小程序的dist包中的原因:如果你是这么引用echarts-for-weixin:
import * as echarts from "../echarts-for-weixin";
而且你没有在业务代码中的comonents中引用该插件,那么你需要找到项目中的pages.json文件,找到该业务代码所对应的文件,添加如下代码:
{ "path": "业务代码所对应的页面", "style": { "usingComponents": { "ec-canvas": "../echarts-for-weixin" } } },
看到usingComponents了没有,你只需要在这里添加echarts-for-weixin进来,下次编译就可以被打包进去了。
啊噢。。。好累、、、、
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧