小程序自定义tabbar custom-tab-bar 6s出不来解决方案,cover-view不兼容
1.从微信小程序的官网扣下来的demo,实际测试中,发现6s ios10 系统不兼容,里面的内容出不来
<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="{{item.checked ? item.selectedIconPath : item.iconPath}}" ></cover-image>
<cover-view >{{item.text}}</cover-view>
</cover-view>
</cover-view>
2.实际效果如下: 底部的tabbar没出来

3.把 cover-view 改成 view 把 cover-image 改成 image 标签
<view class="tab-bar">
<view class="tab-bar-border"></view>
<view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
<image src="{{item.checked ? item.selectedIconPath : item.iconPath}}" ></image>
<view >{{item.text}}</view>
</view>
</view>
4. 记得把你的css 样式也改一下啊 默认的 class 有cover-view cover-image
5.现在的效果如下


小程序自定义tabbar custom-tab-bar 6s出不来解决方案,cover-view不兼容的更多相关文章
- 微信小程序自定义 tabbar
一定的需求情况下,无法使用小程序原生的 tabbar 的时候,需要自行实现一个和 tabbar 功能一模一样的自制组件. 查阅了海量的博客和文档之后,亲自踩坑.总结了三种在不使用微信小程序原生 tab ...
- 微信小程序自定义tabbar的实现
微信小程序自定义tabbar的实现 目的:当采用微信的自定义tabbar组件的时候,切换的时候会出现闪屏的效果:当使用微信默认的tabbar的时候,限制了tabbar的数量以及灵活配置. 方案:自己动 ...
- 微信小程序 自定义tabbar实例
在小程序的开发文档中,对tabbar是这样说明的: 如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以通过 tabBar 配置项指定 tab 栏的表现,以及 t ...
- 微信小程序自定义tabbar的问题
个人感觉小程序的tab样式自定义的能力有所欠缺,不够美观,于是今天自己diy了一个tab 测试的时候发现,无论是使用navigator跳转(会出现点击的效果)还是用bindtap(触摸),因为没有定义 ...
- 微信小程序自定义TabBar
项目中需要根据用户角色控制TabBar中各Item的显示和隐藏,然而小程序自带TabBar没有提供隐藏某个item的功能,只好自己动手写了一个. 1.wxml文件 <view class=&qu ...
- 小程序自定义tabBar,动态控制tabBar
最近做项目的时候,突然来了个小特殊的需求,根据客户的类型来动态显示底部的tabBar菜单.当时我就有点小懵逼了,这个不是小程序自带的组件么?还要做成动态?这就有点尴尬了..... 不过也只是一时尴尬而 ...
- 小程序自定义tabbar
代码片段: wechatide://minicode/IUoCyemJ7D3d GitHub: https://github.com/WozHuang/Miniprogram-Demo/tree/ma ...
- 微信小程序 - 自定义tabbar
更新: 2019-1-18:自定义tabbar组件已发布 各种奇葩的需求,造就了我们 wxml <view class="nav-tabs"> <view cla ...
- 微信小程序 - 自定义tabbar(组件)
配置项(关于使用组件) index.wxml <!-- tabBar:tabBar配置 activeIndex: 激活页面下标 slots: 多插槽配置(需与页面一致) --> <t ...
随机推荐
- Python玩转微信小程序
用Python玩转微信 Python玩转微信 大家每天都在用微信,有没有想过用python来控制我们的微信,不多说,直接上干货! 这个是在 itchat上做的封装 http://itchat. ...
- Vs2012帮助文档安装介绍
Vs2012的帮助文档:Microsoft Help Viewer.exe,vs2010对应的是1.0,vs2012对应的是2.0,版本号以此类推 与早期的chm格式的msdn帮助文档不同在于: 1. ...
- Location配置与ReWrite语法(五)
原文链接:https://www.cnblogs.com/crazylqy/p/6892010.html location表示uri方式定位,基础语法有三种: location = pattern { ...
- GAN与VAE
经典算法·GAN与VAE Generative Adversarial Networks 及其变体 生成对抗网络是近几年最为经典的生成模型的代表工作,Goodfellow的经典工作.通过两个神经网络结 ...
- Excel-图表制作
柱形图:通常使用柱形图比较数据间的数量关系 折线图:使用折线图来反映数据间的趋势关系 饼图:使用饼图来表示数据间的分配关系 对图表进行刷选 再图表设计下的快速布局可以选择各种样式 迷你图 对某列单 ...
- Regular Forestation CodeForces - 1252F(树同构)
Regular Forestation \[ Time Limit: 1000 ms\quad Memory Limit: 262144 kB \] 题意 给出一个节点为 \(n\) 的树,问删掉树上 ...
- [LeetCode] 21. Merge Two Sorted Lists 混合插入有序链表
Merge two sorted linked lists and return it as a new list. The new list should be made by splicing t ...
- Educational Codeforces Round 61 (Rated for Div. 2) E 多重背包优化
https://codeforces.com/contest/1132/problem/E 题意 有8种物品,重量是1~8,每种数量是\(cnt[i]\)(1e16),问容量为W(1e18)的背包最多 ...
- Python程序设计例题
例一:蒙特卡罗方法求解 π 值 from random import random from math import sqrt from time import clock DARTS=1000 hi ...
- vue系列--vue是如何实现绑定事件
一.前言 vuejs中的事件绑定,使用<v-on:事件名 = 函数名>来完成的,这里函数名是定义在Vue实例中的methods对象中的,Vue实例可以直接访问其中的方法. 二.事件绑定方式 ...