uni-app 微信小程序根据角色动态的更改底部tabbar

文章目录

• • 1. 需求背景
  • 2. 问题前提及思路
  • 3. 开始撸
  • • 3.1 设置 `tabbar.js` 配置不同角色不同的菜单
    • 3.2 设置 `page.json`
    • 3.3 vue 配置
    • 3.4 tabBar组件代码
    • 3.5 setRole方法

1. 需求背景

公司要求开发一个小程序，要求二种不同权限的人群都可以使用，使用时根据不同的权限，获取不同的tabbar，以及展示对应不同的内容。

登录页面分为 用户登录 及 管理员登录

1.2 用户登录和管理员登录的 tabbar 根据账号角色进行对应展示

2. 问题前提及思路

uniapp 本身的动态设置tabbar方法 uni.setTabBarItem(OBJECT)，但是使用这个方法刷新切换时会短暂白屏以及uni.setTabBarItem只能满足动态设置tabbar一项的内容，无法实现多项的需求。所有综合考虑决定还是使用u