微信小程序自定义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 相关文章推荐
JavaScript阻止事件冒泡示例分享
Dec 28 Javascript
JavaScript中的变量定义与储存介绍
Dec 31 Javascript
jquery实现在光标位置插入内容的方法
Feb 05 Javascript
js倒计时抢购实例
Dec 20 Javascript
JS添加删除DIV的简单实例
Jul 08 Javascript
JavaScript中捕获/阻止捕获、冒泡/阻止冒泡方法
Dec 07 Javascript
基于JS实现仿百度百家主页的轮播图效果
Mar 06 Javascript
详解用node搭建简单的静态资源管理器
Aug 09 Javascript
微信小程序中setInterval的使用方法
Sep 29 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
Nov 27 Javascript
node app 打包工具pkg的具体使用
Jan 17 Javascript
使用Webpack提升Vue.js应用程序的4种方法(翻译)
Oct 09 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
深入理解curl类,可用于模拟get,post和curl下载
2013/06/08 PHP
php的mkdir()函数创建文件夹比较安全的权限设置方法
2014/07/28 PHP
实例详解PHP中html word 互转的方法
2016/01/28 PHP
PHP面向对象多态性实现方法简单示例
2017/09/27 PHP
php微信开发之关注事件
2018/06/14 PHP
PHP中abstract(抽象)、final(最终)和static(静态)原理与用法详解
2020/06/05 PHP
javascript动态添加表格数据行(ASP后台数据库保存例子)
2010/05/08 Javascript
jQuery find和children方法使用
2011/01/31 Javascript
用Juery网页选项卡实现代码
2011/06/13 Javascript
js获取元素到文档区域document的(横向、纵向)坐标的两种方法
2013/05/17 Javascript
IE8下Jquery获取select选中的值post到后台报错问题
2014/07/02 Javascript
jQuery中[attribute^=value]选择器用法实例
2014/12/31 Javascript
javascript实时显示当天日期的方法
2015/05/20 Javascript
JavaScript实现字符串与日期的互相转换及日期的格式化
2016/03/07 Javascript
JavaScript代码性能优化总结篇
2016/05/15 Javascript
JavaScript仿flash遮罩动画效果
2016/06/15 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
2016/09/09 Javascript
jQuery加载及解析XML文件的方法实例分析
2017/01/22 Javascript
jQuery事件与动画基础详解
2017/02/23 Javascript
利用node.js制作命令行工具方法教程(一)
2017/06/22 Javascript
解决angularjs前后端分离调用接口传递中文时中文乱码的问题
2018/08/13 Javascript
webpack css加载和图片加载的方法示例
2018/09/11 Javascript
如何基于vue-cli3.0构建功能完善的移动端架子
2019/04/24 Javascript
Python实现生成随机数据插入mysql数据库的方法
2017/12/25 Python
python sys,os,time模块的使用(包括时间格式的各种转换)
2018/04/27 Python
利用django+wechat-python-sdk 创建微信服务器接入的方法
2019/02/20 Python
python的pstuil模块使用方法总结
2019/07/26 Python
深入了解Django中间件及其方法
2019/07/26 Python
Python如何读写CSV文件
2020/08/13 Python
python爬虫破解字体加密案例详解
2021/03/02 Python
澳洲在线厨具商店:Kitchen Style
2018/05/05 全球购物
德国购买踏板车网站:Microscooter
2019/10/14 全球购物
《广玉兰》教学反思
2014/04/14 职场文书
党员志愿者活动总结
2014/06/26 职场文书
社区服务活动小结
2014/07/08 职场文书
element tree树形组件回显数据问题解决
2022/08/14 Javascript