这个闪烁真的很迷

我搜了一些资料,进行了以下步骤的操作

第一种解决办法 ,把tabbar自定义组件的this.setData中的代码注释掉

显示tabbar中的页面中,添加下面的:这个好像没什么用啊

第二种方法:把cover-view标签,全部替换成view标签,cover-image也换成icon

我直接上代码,上面是原本的代码,下面是新代码

custom-tab-bar/index.wxml

<!--miniprogram/custom-tab-bar/index.wxml-->
<!-- <cover-view class="tab-bar">
<cover-view class="tab-bar-border"></cover-view>
<cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
<cover-image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></cover-image>
<cover-view style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</cover-view>
</cover-view>
</cover-view> -->
<!--miniprogram/custom-tab-bar/index.wxml-->
<view class="tab-bar">
<view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
<view class="iconfont {{item.icon}}" style="{{selected === index ? 'color: #2a5ceb' : '#ccc'}}">
<van-icon name="{{item.icon}}" style="font-size:24px;color: {{selected === index ? '#2a5ceb': '#444444'}};" />
</view>
<view class="text" style="font-weight:600;font-size:12px;color: {{selected === index ? '#2a5ceb': '#444444'}};">{{item.text}}</view>
</view>
</view>

真的不闪烁了哎!!!!接下来就自己调样式啦~~

最终建议,大家不要用这个了,搞个单页面应用好了,这个真的不好用

解决微信小程序 自定义tabBar 切换时候闪烁问题的更多相关文章

  1. 微信小程序自定义 tabbar

    一定的需求情况下,无法使用小程序原生的 tabbar 的时候,需要自行实现一个和 tabbar 功能一模一样的自制组件. 查阅了海量的博客和文档之后,亲自踩坑.总结了三种在不使用微信小程序原生 tab ...

  2. 微信小程序自定义tabbar的实现

    微信小程序自定义tabbar的实现 目的:当采用微信的自定义tabbar组件的时候,切换的时候会出现闪屏的效果:当使用微信默认的tabbar的时候,限制了tabbar的数量以及灵活配置. 方案:自己动 ...

  3. 微信小程序自定义tabbar的问题

    个人感觉小程序的tab样式自定义的能力有所欠缺,不够美观,于是今天自己diy了一个tab 测试的时候发现,无论是使用navigator跳转(会出现点击的效果)还是用bindtap(触摸),因为没有定义 ...

  4. 微信小程序 自定义tabbar实例

    在小程序的开发文档中,对tabbar是这样说明的: 如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以通过 tabBar 配置项指定 tab 栏的表现,以及 t ...

  5. 微信小程序自定义TabBar

    项目中需要根据用户角色控制TabBar中各Item的显示和隐藏,然而小程序自带TabBar没有提供隐藏某个item的功能,只好自己动手写了一个. 1.wxml文件 <view class=&qu ...

  6. 微信小程序 - 自定义tabbar

    更新: 2019-1-18:自定义tabbar组件已发布 各种奇葩的需求,造就了我们 wxml <view class="nav-tabs"> <view cla ...

  7. 微信小程序——自定义菜单切换栏tabbar组件

    效果图: wxml代码: <view class="top_tabbar" > <block wx:for="{{itemName}}" wx ...

  8. 微信小程序 - 自定义tabbar(组件)

    配置项(关于使用组件) index.wxml <!-- tabBar:tabBar配置 activeIndex: 激活页面下标 slots: 多插槽配置(需与页面一致) --> <t ...

  9. 微信小程序 - 自定义switch切换(示例)

    点击下载:switch示例 ,适用于表单,官方switch 说明 .

  10. 如何解决微信小程序界面适配问题-引用-生命周期回调函数-优化机制-样式引入

    如何解决微信小程序界面适配问题 .wxss page{ height: 100%; width:750rpx; } this.setData({ imageWidth: wx.getSystemInf ...

随机推荐

  1. Asp.Net Core MVC传值 Asp.Net Core API 前台写法

    $("#Add_User").click(function () { var obj = { //"属性名": 传递的值, "User_Name&qu ...

  2. 各种优化器对比--BGD/SGD/MBGD/MSGD/NAG/Adagrad/Adam

    指数加权平均 (exponentially weighted averges) 先说一下指数加权平均, 公式如下: \[v_{t}=\beta v_{t-1}+(1-\beta) \theta_{t} ...

  3. Codeforces Round #805 (Div. 3)G2. Passable Paths

    题目大意: 给出一个无向无环连通图(树),n个点n-1条边,m次查询,每次询问给出一个集合,问集合里的树是否都在同一条链上(即能否不重复的走一条边而遍历整个点集) 思路:通过求lca,若有三个点x,y ...

  4. 写一个shell,自动执行jmeter测试脚本

    贡献一个自己写的shell脚本,很简单,但又可以高效率的自动执行jmeter压测脚本. #!/bin/bash #author:zhangyl #version:V1 #该脚本放置于压测脚本的上一层目 ...

  5. springcloud组件梳理之hystrix

    在微服务架构体系中,各服务中间的相互调用是常态,没有哪个服务能保证自身百分百不会出问题,然后再加上网络的波动以及环境等问题,服务间调用的稳定性无法保证,这时候就需要一个有容错能力的组件来介入,当调用出 ...

  6. 2022春每日一题:Day 18

    题目:[JSOI2007]字符加密 很常见的做法,破环为链,然后以2n为总长再后缀排序,然后对于SA[i] < n 的,说明第i小后缀的编号是小于n的,也就是说,以i开头的编号是合法的,那么输出 ...

  7. tekla软件安装教程

    Tekla2020 WIN10 64位安装步骤: 1.先使用"百度网盘客户端"下载Tekla2020_x64软件安装包到电脑磁盘,并鼠标右击进行解压缩,安装前先断开电脑网络,然后找 ...

  8. LayuI 动态下拉框和动态设置选中

    动态下拉框 //下拉框异步加载 function asyncSelect(thisId, grade, selectNodeName) { $("#" + selectNodeNa ...

  9. 【大数据面试】【框架】Linux命令、Shell工具、常见Shell脚本(群起脚本、数仓导入)

    一.Linux 1.常用高级命令 ps -ef:查看进程详情,ps -ef|grep dae可以搜索指定进程,-e表示环境变量 ps -au:以用户为主的详细格式,显示进程平均占用资源,不包括cmd列 ...

  10. java 如何正确使用接口返回对象Result

    1. Result的使用 Result的使用,是java项目中开发接口的必备,它经常被我们用作接口的返回对象,方便前端或者其他程序的远程调用后处理业务.它一般包括以下几个属性: code:一般根据系统 ...