微信小程序tabBar模板用法实例分析【附demo源码下载】
本篇章节讲解微信小程序tabBar模板用法。分享给大家供大家参考,具体如下: 众所周知,微信小程序的tabBar都是新开页面的,而微信文档上又表明了最多只能打开5层页面。这样就很容易导致出问题啦,假如我的tabBar有5个呢?下面是微信原话: 一个应用同时只能打开5个页面,当已经打开了5个页面之后, 因此这几天想着根据微信tabBar数组来自定义模板供页面调用。不过我在list里面每个对象都增加了一个selectedColor和active属性,方便对每个tabBar当前页做样式,如果不传直接使用设置的selectedColor。因此这串数据只能设定在各个页面下,不能设定在公用的app.js配置文件下,稍微有点代码冗余,下次研究下怎么直接配置到app.js完善下。 只要新建一个tarBar.wxml模板页,然后引用模板的页面传入数据即可,代码如下: 接下来进行测试,首先是index.js的配置对象: index.wxml引入模板: 接下来是mine.js文件引入配置对象: mine.wxml引入模板: 最后演示如下: 方案二,我把配置数据统一放在app.js文件,通过点击跳转页面后在把数据添加到当前页面实例上,具体做法如下: 1、app.js文件配置:
var _pagePath=_curPage.__route__;
if(_pagePath.indexOf('/') != 0){
_pagePath='/'+_pagePath;
}
var tabBar=this.globalData.tabBar;
for(var i=0; i
2、index.js+mine.js+city.js页面使用: 最终演示和上图一致! 附:完整demo代码点击此处本站下载。希望本文所述对大家微信小程序开发有所帮助。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |