原生小程序中-登录判断，没登录不显示内容

键盘敲烂工资过万！

已于 2023-06-12 11:12:02 修改

阅读量325

点赞数

分类专栏：微信小程序开发文章标签：小程序

于 2023-06-12 11:02:00 首次发布

本文链接：https://blog.csdn.net/weixin_57127914/article/details/131164428

版权

微信小程序开发专栏收录该内容

17 篇文章 1 订阅

订阅专栏

文章介绍了如何在微信小程序中创建一个名为authorization的自定义组件，用于检测用户登录状态。当用户未登录时，组件会隐藏页面内容并重定向到登录页面，同时保存未访问页面的路径。登录成功后，用户将被定向回之前尝试访问的页面。

摘要由CSDN通过智能技术生成

1，在根目录创建 components，然后在它里面创建一个authorization(随意以后用当插件用)

2，在components/authorization目录中创建组件

a：完成结构

<!-- 用户未登录就不显示页面的内容 -->
<slot wx:if="{{ isShow }}"></slot>

b：完成逻辑

// components/authorization/index.js
Component({
  // 使用组件时，要判断是否存在 token （如果存在，不管；不存在，跳转到登录页面）
  attached() {
    const token = getApp().token
    this.setData({
      isShow: token ? true : false,
    })
    if (!token) {
      wx.reLaunch({ url: '/pages/login/index' })
      return
    }
  },
})

c：在 app.json 中全局注册该组件

{
  ...
  "usingComponents": {
     "authorization": "./components/authorization/index",
  }
  ...
}

d：在要使用的 wxml中使用

<authorization>
wxml内容
</authorization>

包起来当isShow为 true 就显示为 false就不显示

加强-登录检测 - 封装组件 - 保存未访问的页面

说明：

--未登录时，应该将本次访问的页面保存起来

--等到登录成功，再次跳转到这个页面中

--未访问的页面路径我们可以保存在登录的路径上

步骤：

--a：获取跳转的页面路径

--b：在跳转到登录页面时，保存到登录路径中

// components/authorization/index.js
Component({
  // 使用组件时，要判断是否存在 token （如果存在，不管；不存在，跳转到登录页面）
  attached() {
    const token = getApp().token
    this.setData({
      isShow: token ? true : false,
    })
    if (!token) {
      const pages = getCurrentPages() //getCurrentPages() 函数用于获取当前页面栈的实例
      // 保存当前页面路径
      const path = '/' + pages[pages.length - 1].route  //固定写法
      wx.reLaunch({ url: `/pages/login/index?redirectURL=${path}` })
      return
    }
  },
})