微信小程序登陆鉴权最佳实现

---

一、使用步骤

1.创建鉴权组件auth

2.app.json中注册全局组件

3.页面使用组件

4. 读取本地存储的 token 数据，用于判断是否曾登录过

// app.js
App({
  onLaunch() {
    // 读取本地存储的 token 数据
    this.getToken()
  },
  getToken() {
    // 将 token 数据记到应用实例中
    this.token = wx.getStorageSync('token')
  }
})

5. 检测登录状态，要求未登录时不显示页面中的内容且跳转到登录页面

<!-- /components/auth/index.wxml -->
<slot wx:if="{{isLogin}}"></slot>

// /components/authorization/index.js
Component({
  data: {
    isLogin: false,
  },
  lifetimes: {
    attached() {
      // 获取登录状态
      const isLogin = !!getApp().token
      // 变更登录状态
      this.setData({ isLogin })
      // 未登录的情况下跳转到登录页面
      if (!isLogin) {
        wx.redirectTo({
          url: '/pages/login/index',
        })
      }
    },
  },
})