uniapp 自定义底部导航栏设置

该方案结合uview Tabbar 实现
uniapp 自定义底部导航栏设置_第1张图片

根据文档可知
1、在page中正常写入
uniapp 自定义底部导航栏设置_第2张图片
2、在各个tabbar页面引入u-tabbar组件,组件会默认自动通过uni.hideTabBar()隐藏系统tabbaru-tabbar级别最好和内容最外层同级

uniapp 自定义底部导航栏设置_第3张图片
3、用vuex 实现动态切换
uniapp 自定义底部导航栏设置_第4张图片
4、根据权限动态分配
uniapp 自定义底部导航栏设置_第5张图片

uniapp 自定义底部导航栏设置_第6张图片

你可能感兴趣的:(uni-app,unia)