15年软件开发经验 只做源码定制 互联网+定制化解决方案

15年软件开发经验,只做源码定制!

原创设计 定制开发

满足您的个性化需求

当前位置:首页 后端开发 Thinkphp5

解决uniapp的qiun-data-charts组件或者某些组件层级过高的问题

王少铮| 发布于 2021-09-09 10:54:57| 1135阅读| 0点赞| 0评论
举报

解决思路是先看看能不能通过z-index来设置,不行的话就需要通过说明文档来找解决办法

在用qiun-data-charts组件的时候,微信开发者工具上显示是正常的,但是真机调试或者线上就会组件层级过高,影响到导航栏或者某些元素的显示,刚开始我试着用z-index解决,后来发现没啥用,于是就在组件的说明文档里找到了解决方案

解决qiun-data-charts组件层级过高的方案

先写一个生成32位随机字符串的方法

//生成32位随机字符串
			sanshi(){
				let str = 'abcdefghijklmnopqrstuvwxyz0123456789ABCDEFJHIJKLMNOPQRSTUVWXYZ';
				this.num = '';
				for(let i=0;i<32;i++){
					this.num += str.charAt(Math.floor(Math.random() * str.length));
				};
				console.log('字符串',this.num)
			},


然后在template里修改一下

<qiun-data-charts :canvasId="num" canvas2d="true" type="line" :chartData="chartData" :errorShow="false" background="none" ></qiun>
	//使用canvas2d之前需要传canvasId,必传,这个num就是32位随机不重复字符串,然后canvas2d改为true	

然后就可以正常使用了,虽然不能使用真机调试(文档上说的,而且强调了三遍),但是上线后手机端是正常的

0

0条评论

别默默看啦~登录/注册一起参与讨论吧~

热门标签

王少铮
微信扫一扫立即咨询
账号登录|扫码登录

立即注册 |忘记密码?

欢迎注册

已有账号马上登录

重置密码

扫码绑定微信
微信扫一扫

绑定手机号

分享到-微信

举报

  • 举报类型:

  • 举报描述:

您好,当前积分不足。

在线客服
拨打电话
17330196230 13230981129
顶部