小程序引导用户授权的思路与项目实现方法及代码剖析

<button>允许用户授权</button>

// 查看是否授权,保存授权状态

    wx.getSetting({

        success: function(res) {

            if (res.authSetting['scope.userInfo']) {

                wx.setStorageSync('isAuthorize', 'true');

                wx.getUserInfo({

                    success: function(res) {

                        wx.setStorageSync('userInfo', res.rawData);

                    }

                })

            } else {

                wx.setStorageSync('isAuthorize', 'false');

            }

        }

    })

<!-- 小程序授权组件 -->

<authorize></authorize>

// 已授权隐藏弹框，未授权显示弹框

this.authorize = this.selectComponent("#authorize");

if (wx.getStorageSync('isAuthorize')=='true'){

    this.authorize.hideDialog()

}

"usingComponents": {

    "authorize": "自定义授权组件的路径"

}

/*authorize.js*/

Component({

    options: {

        multipleSlots: true

    },

    data: {

        isHide: false,

        canIUse: wx.canIUse('button.open-type.getUserInfo')

    },

    methods: {

        //隐藏弹框

        hideDialog() {

            this.setData({

                isHide: true

            })

        },

        // 授权信息保存

        bindGetUserInfo(e){

            wx.setStorageSync('isAuthorize', 'true');

            wx.setStorageSync('userInfo', JSON.stringify(e.detail.userInfo));

            this.hideDialog()

        }

    }

})