微信小程序自定义tabbar custom-tab-bar 6s出不来解决方案(cover-view不兼容)


Posted in Javascript onNovember 01, 2019

微信小程序自定义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没出来

微信小程序自定义tabbar custom-tab-bar 6s出不来解决方案(cover-view不兼容)

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 custom-tab-bar 6s出不来解决方案(cover-view不兼容)

总结

以上所述是小编给大家介绍的微信小程序自定义tabbar custom-tab-bar 6s出不来解决方案(cover-view不兼容),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
Mootools 1.2教程(21)——类(二)
Sep 15 Javascript
javascript写的一个链表实现代码
Oct 25 Javascript
Js 回车换行处理的办法及replace方法应用
Jan 24 Javascript
node.js中的socket.io入门实例
Apr 26 Javascript
JS简单操作select和dropdownlist实例
Nov 26 Javascript
jquery实现的点击翻书效果代码
Nov 04 Javascript
JS中取二维数组中最大值的方法汇总
Apr 17 Javascript
微信小程序 后台https域名绑定和免费的https证书申请详解
Nov 10 Javascript
微信小程序 底部导航栏目开发资料
Dec 05 Javascript
jQuery插件FusionCharts实现的3D柱状图效果实例【附demo源码下载】
Mar 03 Javascript
ES6的Fetch异步请求的实现方法
Dec 07 Javascript
JQuery中的常用事件、对象属性与使用方法分析
Dec 23 jQuery
Vue-cli项目部署到Nginx服务器的方法
Nov 01 #Javascript
浅谈vue-router路由切换 组件重用挖下的坑
Nov 01 #Javascript
浅析js实现网页截图的两种方式
Nov 01 #Javascript
javascript使用链接跨域下载图片
Nov 01 #Javascript
async/await让异步操作同步执行的方法详解
Nov 01 #Javascript
浅谈Three.js截图并下载的大坑
Nov 01 #Javascript
vue中使用vee-validator完成表单校验方案
Nov 01 #Javascript
You might like
PHP循环获取GET和POST值的代码
2008/04/09 PHP
PHP对表单提交特殊字符的过滤和处理方法汇总
2014/02/18 PHP
php获取目标函数执行时间示例
2014/03/04 PHP
php中array_multisort对多维数组排序的方法
2020/06/21 PHP
php微信开发之图片回复功能
2018/06/14 PHP
转换字符串为json对象的方法详解
2013/11/29 Javascript
javascript动态设置样式style实例分析
2015/05/13 Javascript
javascript设计模式之对象工厂函数与构造函数详解
2015/07/30 Javascript
JavaScript字符串删除重复字符的方法
2015/12/25 Javascript
JS动态增删表格行的方法
2016/03/03 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
2016/10/26 Javascript
Angular-Touch库用法示例
2016/12/22 Javascript
js实现hashtable的赋值、取值、遍历操作实例详解
2016/12/25 Javascript
JS实现简易的图片拖拽排序实例代码
2017/06/09 Javascript
javascript基于定时器实现进度条功能实例
2017/10/13 Javascript
js中的 || 与 &amp;&amp; 运算符详解
2018/05/24 Javascript
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
2018/11/21 Javascript
vue 实现websocket发送消息并实时接收消息
2019/12/09 Javascript
[54:53]2014 DOTA2国际邀请赛中国区预选赛 LGD-GAMING VS CIS 第二场
2014/05/23 DOTA
python将多个文本文件合并为一个文本的代码(便于搜索)
2011/03/13 Python
PyQt5每天必学之单行文本框
2018/04/19 Python
Python 在字符串中加入变量的实例讲解
2018/05/02 Python
pytorch打印网络结构的实例
2019/08/19 Python
Python下利用BeautifulSoup解析HTML的实现
2020/01/17 Python
python 代码运行时间获取方式详解
2020/09/18 Python
html5 datalist 选中option选项后的触发事件
2020/03/05 HTML / CSS
Everything But Water官网:美国泳装品牌
2019/03/17 全球购物
本科生职业生涯规划书范文
2014/01/21 职场文书
市场专员岗位职责
2014/02/14 职场文书
企业宣传工作方案
2014/06/02 职场文书
2014年大学生职业规划书:未来不是梦,只要勇敢冲!
2014/09/22 职场文书
药品销售内勤岗位职责
2015/04/13 职场文书
让人瞬间清醒的句子,句句经典,字字如金
2019/07/08 职场文书
nginx搭建图片服务器的过程详解(root和alias的区别)
2021/03/31 Servers
SQL Server #{}可以防止SQL注入
2022/05/11 SQL Server
CSS list-style-type属性使用方法
2023/05/21 HTML / CSS