微信小程序自定义底部导航栏，切换不同页面显示不同tabbar

在一个微信小程序中想要用到两种不同的tabbar样式，需要在app.js中自定义，在页面加载时进行调用。

比如一个小程序需要两个版本（用户版、商家版），并且能通过一个按钮在两个版本间进行切换，可能会用到这种方式。

此处以两个页面（index，logs）显示两种tabbar样式为例，通过切换按钮进行切换。

首先有一个模板文件：tabbar.wxml

在app.json中无需定义“tabBar”

在app.js中自定义如下

在app.wxss中定义显示样式

index.wxml，用到自定义tabbar的页面的首部都需要引入模板文件

index.js

logs.js

加载自定义tabbar的那句话（app.editTabBar）写在onload或onshow中都可以。

只写了两个主页面，其他页面可自行定义跳转。

最后放上效果图：

给你个思路

写一个js函数 在所有页面调用

通过获取当前页面url 来判断 是该给那个li加样式

比如 如果当前页面url是news.asp

用jquery写

$("#jsddm").find("li").each(function()

{

if($(this).text()=="新闻动态")

 {

  

    $(this).addClass("ahover")}

else{

      

$(this).removeClass()}

})

以上只是思路 不要照抄

---