iis 网站访问权限,设计画册,wordpress 后台 慢,wordpress 后台 324遇到这个需求之前一直使用的小程序默认底部导航栏#xff0c;且小程序默认入口页面为pages/index/index#xff0c;要使不同角色呈现不同底部导航栏#xff0c;必须要在不同页面引用不同的自定义导航栏。本篇将结合分包#xff08;subPackages#xff09;展开以下三步叙述…遇到这个需求之前一直使用的小程序默认底部导航栏且小程序默认入口页面为pages/index/index要使不同角色呈现不同底部导航栏必须要在不同页面引用不同的自定义导航栏。本篇将结合分包subPackages展开以下三步叙述。
一、创建不同角色的页面
1、目录中创建分包personA、personB。
2、app.json补充分包配置。 二、创建不同角色的底部导航栏
1、在conponents目录下创建personA和personB的自定义导航栏组件。 2、填充导航栏内容。
!--components/tabBarA/tabBarA.wxml--
view classbottom-fixedtextA的底部导航栏/text
/view/* components/tabBarA/tabBarA.wxss */
.bottom-fixed{width: 100%;height: 200rpx; position: fixed;bottom: 0;background-color: antiquewhite;
}
!--components/tabBarB/tabBarB.wxml--
view classbottom-fixedtextB的底部导航栏/text
/view/* components/tabBarB/tabBarB.wxss */
.bottom-fixed{width: 100%;height: 200rpx;position: fixed;bottom: 0;background-color:azure;
}
三、完善页面内容
1、完善pages/index/index页面控制跳转到personA或者personB的页面。
// index.js
Page({onShow(option){wx.reLaunch({url: /personA/index/index,// url: /personB/index/index,})}
})
2、 完善personA的页面
!--personA/index/index.wxml--
textpersonA的页面/texttabBar/tabBar!--personA/index/index.json--
{usingComponents: {tabBar: /components/tabBarA/tabBarA}
}
3、完善personB的页面
!--personB/index/index.wxml--
textpersonB的页面/texttabBar/tabBar!--personB/index/index.json--
{usingComponents: {tabBar: /components/tabBarB/tabBarB}
} 完结。
