小程序实现菜单/按钮权限（搭配若伊框架管理系统

获取菜单权限

在登录后，调用getInfo接口，获取到菜单权限

  wx.http('/getInfo').then(response => {
    let list = response.permissions.filter(r => r.includes('app:'))
    wx.setStorageSync('permissions', list)
    setTimeout(() => {
      wx.switchTab({
        url: '/pages/menu/menu',
      })
    }, 500)
  })

小程序代码

// pages/menu/menu.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    menuList: [
      { name: "信息上报", url: "/pages/menu/messageReportList/messageReportList", src: "../../assets/imgs/messageReport.png", permi: 'app:menu:messageReport' },
      { name: "警情上报", url: "/pages/menu/fireReportList/fireReportList", src: "../../assets/imgs/fireReport.png", permi: 'app:menu:fireReportList' },
      { name: "设备物联", url: "/pages/menu/equipment/equipment", src: "../../assets/imgs/equipment.png", permi: 'app:menu:deviceIOT' },
      { name: "画面直播", url: "/pages/menu/living/living", src: "../../assets/imgs/living.png", permi: 'app:menu:framesLive' },
      { name: "营区监控", url: "/pages/menu/monitoring/monitoring", src: "../../assets/imgs/monitoring.png", permi: 'app:menu:subcampMonitoring' },
      { name: "协同会商", url: "/pages/menu/cooperate/cooperate", src: "../../assets/imgs/cooperate.png", permi: 'app:menu:cooperate' },
    ],
    menuItemList: [], // 页面展示的菜单
  },
  gotoMenuItem(e) {
    let url = e.currentTarget.dataset.item.url;
    wx.navigateTo({
      url: url,
    })
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    this.setData({ token: wx.getStorageSync('token') })
    var list = []
    let perm = wx.getStorageSync('permissions')
    if (perm) {
      console.log(perm);
      if (perm.includes("*:*:*")) { // 若伊框架的无敌权限
        this.setData({ menuItemList: this.data.menuList })
      } else {
        this.data.menuList.forEach(item => { // 每个按钮做匹配
          let i = perm.find(r => r == item.permi)
          if (i) {
            list.push(item)
          } else {
            return
          }
        })
        this.setData({ menuItemList: list })
      }
    }
  },
})

后台管理中的菜单配置

本质上是配置按钮权限