微信小程序（五十九）使用鉴权组件时原页面js自动加载解决方法（24/3/14）

注释很详细，直接上代码

上一篇

新增内容：

1.使用覆盖函数的方法阻止原页面的自动执行方法

2.使用判断实现只有当未登录时才进行方法覆盖

源码：

app.json

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "Weixin",
    "navigationBarBackgroundColor": "#ffffff"
  },
  "usingComponents": {
    "auth":"/Components/auth/auth"
  },

  "componentFramework": "glass-easel",
  "sitemapLocation": "sitemap.json",
  "lazyCodeLoading": "requiredComponents"
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

auth组件
auth.wxml

<slot wx:if="{{isLoad}}"></slot>
1

auth.json

{
  "component": true,
  "usingComponents": {}
}
1
2
3
4

auth.js

// Components/auth/auth.js
Component({

  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {//这里的设置模拟页面内容不出现的情况
    isLoad:true
  },

  
  //覆盖使用的方法
  attached(){
    if(this.data.isLoad==false){//当鉴权组件检测到未登录时覆盖
      //获取当前页面栈数组
      const pages=getCurrentPages()

      //获取当前页面实例
      const page=pages[pages.length-1]

      //箭头写法要注意
      page.onLoad=()=>{
        console.log("1.已覆盖onLoad方法")
      },
      page.onShow=()=>{
        console.log("2.已覆盖onShow方法")
      },
      page.onReady=()=>{
        console.log("3.已覆盖onReady方法")
      }
    }
  },
  

  
  /**
   * 组件的方法列表
   */
  methods: {

  }
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

index.wxml

<auth>当登入状态为false时才会显示</auth>

1
2

index.js

Page({
 onLoad(){
   console.log('
声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家小花儿/article/detail/261782