项目中因为需求,底部的tab导航栏是自己写的,在开发者工具中一切正常;但是在真机上页面滑动时,echarts的层级比tab高,调过两者的z-index后仍然如此。

经过查找后发现cover-viewcover-image替换tab的view后,可以解决以上的问题。

<!--底部公共tabBar-->
<cover-view class="tabbar-con">
<cover-view class="{{villageIs?'nav-btn-hover':'nav-btn'}}" bindtap="onGetVillage">
<cover-image class='icon_village_after icon' wx:if="{{villageIs}}" src=''></cover-image>
<cover-image class='icon_village_before icon' wx:else src=''></cover-image>
<cover-view>小区</cover-view>
</cover-view>
<cover-view class="{{shopcarIs?'nav-btn-hover':'nav-btn'}}" bindtap="onGetShopcar">
<cover-image class='icon_shop_after icon' wx:if="{{shopcarIs}}" src=''></cover-image>
<cover-image class='icon_shop_before icon' wx:else src=''></cover-image>
<cover-view>购物车</cover-view>
</cover-view>
<cover-view class="{{newsIs?'nav-btn-hover':'nav-btn'}}" bindtap="onGetNews">
<cover-image class='icon_news_after icon' wx:if="{{newsIs}}" src=''></cover-image>
<cover-image class='icon_news_before icon' wx:else src=''></cover-image>
<cover-view>新闻</cover-view>
</cover-view>
<cover-view class="{{mineIs?'nav-btn-hover':'nav-btn'}}" bindtap="onGetMine">
<cover-image class='icon_mine_after icon' wx:if="{{mineIs}}" src=''></cover-image>
<cover-image class='icon_mine_before icon' wx:else src=''></cover-image>
<cover-view>我的</cover-view>
</cover-view>
</cover-view>

微信小程序echarts层级太高的更多相关文章

  1. 解决微信小程序textarea层级太高遮挡其他组件的问题

    <view class='remark'> <view class='title'> 备注说明 </view> <textarea class='mark_t ...

  2. 关于微信小程序textarea层级过高问题解决

    一.前言 相信做过微信小程序开发的人应该都碰到过这个问题,因为这个需求实在太常见了 由于textarea是属于原生组件,层级最高,不管在页面中我们设置z-index值多少都会被textarea组件遮挡 ...

  3. 微信小程序textarea层级过高(盖住其他元素)

    根据官方文档,textarea 是原生组件 (https://developers.weixin.qq.com/miniprogram/dev/component/textarea.html),所谓原 ...

  4. 微信小程序 textarea 层级过高的解决方式

    建立一个新的textarea 组件代替原生textarea ,废话不多说,上代码 <template> <view class="ui-textarea"> ...

  5. 微信小程序 Echarts 异步数据更新

    微信小程序 Echarts 异步数据更新的练习,被坑了很多次,特作记录. 作者:罗兵 地址:https://www.cnblogs.com/hhh5460/p/9989805.html 0.效果图   ...

  6. 微信小程序避坑指南——echarts层级太高/层级遮挡

    问题:小程序中echarts因为小程序原生的canvas层级太高,而导致弹窗这类dom元素无法遮挡住canvas,如下图: 解决方案1:(wx:if控制dom显隐,显示canvas就重新渲染echar ...

  7. 【猿分享第10期】微信小程序Meetup扫盲专场回顾(转载)

    首先感谢答疑师:子慕 前端工程师,目前就职于医联,偶尔写点博客,吐槽总结,偶尔吟“湿”作对,润滑万物,江湖人称子慕大诗人. 直播间语音回放收听,请微信扫描下图二维码授权进入即可. 以下为本次直播的全部 ...

  8. 解决微信小程序视频组件层级过高的问题

    本文首发于我的个人博客:http://www.fogcrane.org 前言 在微信小程序的开发中,总有一些"VIP"组件,他们的层级,高得让人抓狂,总是凌驾于很多其他低层级组件之 ...

  9. 微信小程序 textarea的placeholder层级过高 在弹层之上 bug解决方法

    微信小程序textarea的placeholder的层级一直都是一个神坑, 我们是没有办法将我们的弹层加大层级去盖过placeholder的, 所以要解决这个问题只能从另外的角度找思路 我的思路是 : ...

随机推荐

  1. 连接到放置本地yum源服务器之前的注意事项

    1.确认系统防火墙关闭 2.启动httpd服务 service httpd start 如果提示没有httpd服务: 安装httpd服务 yum install -y httpd 作者:Daley Z ...

  2. ArcGIS 产品体系结构

    1. 开篇 本文主要从以下几个方面介绍 ArcGIS 的产品体系 2. 详细介绍 2.1 ArcGIS Desktop 参考:[https://blog.csdn.net/hphone/article ...

  3. github routine

    1. 从官方库fork 自己的分支库后,git clone到local. 2. local的remotes/origin默认是自己的分支库.可以添加remotes/upstream指向官方库. 3. ...

  4. Apache下载、安装及配置(Windows版)

    一.Apache的下载 1.点击链接http://httpd.apache.org/download.cgi,找到所需版本,如下图位置: 2.点击所需版本,选择Windows文件格式,如下图位置: 3 ...

  5. 结构化您的Python工程

    我们对于"结构化"的定义是您关注于怎样使您的项目最好地满足它的对象性,我们 需要去考虑如何更好地利用Python的特性来创造简洁.高效的代码.在实践层面, "结构化&qu ...

  6. Jvm虚拟机结构与机制

    JVM(Java Virtual Machine)在研究JVM的过程中会发现,其实JVM本身就是一个计算机体系结构,很多原理和我们平时的硬件.微机原理.操作系统都有十分相似的地方,所以学习JVM本身也 ...

  7. 以太坊ERC20代币开发

    以太坊ERC20代币开发首先需要对以太坊,代币,ERC20,智能合约等以太坊代币开发中的基本概念有了解.根据我们的示例代码就可以发行自己的以太坊代币. 什么是ERC20 可以把ERC20简单理解成以太 ...

  8. Mysql 30条军规

    一.基础规范 (1)必须使用InnoDB存储引擎 解读:支持事务.行级锁.并发性能更好.CPU及内存缓存页优化使得资源利用率更高 (2)必须使用UTF8字符集 解读:万国码,无需转码,无乱码风险,节省 ...

  9. Linux kernel的中断子系统之(二):IRQ Domain介绍

    返回目录:<ARM-Linux中断系统>. 总结:一.二概述了软硬件不同角度的IRQ Number和HW Interrupt ID,这就需要他们之间架个桥梁. 三介绍了架设这种桥梁的几种方 ...

  10. Windows上使用Thunderbird与GPG发送和解密公钥加密的电子邮件

    作者:荒原之梦 原文链接:http://zhaokaifeng.com/?p=552 非对称加密的原理: 最先出现的加密方法是对称加密.在对称加密算法中是不区分公钥和私钥的,加密与解密使用的都是同一个 ...