微信小程序自定义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 相关文章推荐
jquery.boxy插件的iframe扩展代码
Jul 02 Javascript
改写一个简单的菜单 弹性大小
Dec 02 Javascript
JQuery入门——用one()方法绑定事件处理函数(仅触发一次)
Feb 05 Javascript
一个简单的jQuery插件ajaxfileupload.js实现ajax上传文件例子
Jun 26 Javascript
jQuery简单实现隐藏以及显示特效
Feb 26 Javascript
浅谈JavaScript异常处理语句
Jun 26 Javascript
JavaScript对Cookie进行读写操作实例
Jul 25 Javascript
jquery实现模拟百分比进度条渐变效果代码
Oct 29 Javascript
jQuery动画效果图片轮播特效
Jan 12 Javascript
jQuery实现的自适应焦点图效果完整实例
Aug 24 Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
Jan 18 Javascript
React中ES5与ES6写法的区别总结
Apr 21 Javascript
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
redis 队列操作的例子(php)
2012/04/12 PHP
php写的带缓存数据功能的mysqli类
2012/09/06 PHP
从零开始学YII2框架(二)通过 Composer 安装扩展插件
2014/08/20 PHP
php等比例缩放图片及剪切图片代码分享
2016/02/13 PHP
Yii 2.0中场景的使用教程
2017/06/02 PHP
在laravel中使用with实现动态添加where条件
2019/10/10 PHP
javascript中的对象创建 实例附注释
2011/02/08 Javascript
file模式访问网页时iframe高度自适应解决方案
2013/01/16 Javascript
Jquery实现仿腾讯微博发表广播
2014/11/17 Javascript
在Ubuntu系统上安装Ghost博客平台的教程
2015/06/17 Javascript
jQuery实现的类似淘宝网站搜索框样式代码分享
2015/08/24 Javascript
jQuery自定义动画函数实例详解(附demo源码)
2015/12/10 Javascript
javascript弹性运动效果简单实现方法
2016/01/08 Javascript
详解JavaScript对象的深浅复制
2017/03/30 Javascript
Vue利用路由钩子token过期后跳转到登录页的实例
2017/10/26 Javascript
vue源码解析之事件机制原理
2018/04/21 Javascript
layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)
2019/09/23 Javascript
node.js域名解析实现方法详解
2019/11/05 Javascript
Element InputNumber计数器的使用方法
2020/07/27 Javascript
vue print.js打印支持Echarts图表操作
2020/11/13 Javascript
[03:44]2014DOTA2国际邀请赛 71专访:DK战队赛前讨论视频遭泄露
2014/07/13 DOTA
简单谈谈python中的Queue与多进程
2016/08/25 Python
python3+PyQt5图形项的自定义和交互 python3实现page Designer应用程序
2020/07/20 Python
python操作mysql代码总结
2018/06/01 Python
python实现一个简单的udp通信的示例代码
2019/02/01 Python
python cv2截取不规则区域图片实例
2019/12/21 Python
Pytorch Tensor基本数学运算详解
2019/12/30 Python
python在CMD界面读取excel所有数据的示例
2020/09/28 Python
台湾乐天市场:日本No.1的网路购物网站
2017/03/22 全球购物
Infababy英国:婴儿推车、Travel System婴儿车和婴儿汽车座椅销售
2018/05/23 全球购物
猫咪家具:CatsPlay
2018/11/03 全球购物
公司门卫岗位职责
2014/03/15 职场文书
体育运动口号
2014/06/09 职场文书
观看《周恩来的四个昼夜》思想汇报
2014/09/12 职场文书
人生遥控器观后感
2015/06/11 职场文书
演讲开头怎么书写?
2019/08/06 职场文书