更新记录

1.0(2023-11-26) 下载此版本

微信小程序获取头像,微信小程序获取昵称,微信小程序获取手机号


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.96 × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

安装教程

  1. 下载组件导入项目」

  2. 核心使用代码

            <script>
                import request from '@/common/request.js';
                import wkWxlogin from '@/components/wk-wxlogin/wk-wxlogin.vue';
                export default {
                    components:{
                        wkWxlogin
                    },
                    data() {
                        return {
                            user: {},
                            zheshow:false, // 控制弹窗显示隐藏
                        }
                    },
                    onShow() {
    
                    },
                    onLoad() {
    
                    },
                    mounted() {
                         this.getUser()
                    },
                    onReachBottom() {
    
                    },
                    onShareAppMessage() {
                        return {
                            title: '分享'
                        }
                    },
                    methods: {
                        login_zheshow(){
                            this.zheshow = !this.zheshow
                        },
                        loset(Logon_Credentials){
                            let that = this
                            let opts = {
                                url: 'api/User/avatar',
                                method: 'post', 
                            };
                            let param = Logon_Credentials 
                            request.httpTokenRequest(opts,param).then(res => { 
                                if (res.statusCode == 200) {
                                    that.user = res.data.body; 
                                }  
                            });
                            console.log(Logon_Credentials,'登录信息')
                        },
                        getUserInfo() {  
                            this.zheshow = true;
                        } ,
                        getUser(){
                            let that = this
                            let opts = {
                                url: 'api/User/info',
                                method: 'get', 
                            };
                            let param = {} 
                            request.httpTokenRequest(opts,param).then(res => { 
                                if (res.statusCode == 200) {
                                    that.user = res.data.body; 
                                }  
                            });
                        }, 
                    }
                }
            </script>
            <style lang="scss" scoped>
                .container {
                    width: 750rpx;
                    color: #333333;
    
                    .bg-top {
                        margin-top: -1rpx;
                        width: 750rpx;
                        height: 220rpx;
                        padding-top: 50rpx;
                        border-radius: 0 0 20% 20%;
    
                        .top-box {
                            width: 700rpx;
                            background-color: #FFFFFF;
                            margin: 0 auto;
                            border-radius: 20rpx;
                            padding: 20rpx 30rpx 0rpx;
                            position: relative;
    
                            .qh-pic {
                                position: absolute;
                                right: 64rpx;
                                top: -50rpx;
                                border-radius: 12rpx;
                            }
    
                            .qh-title {
                                width: 100%;
                                height: 60rpx;
                                line-height: 65rpx;
                                padding-right: 190rpx;
                            }
    
                            .bxBox {
                                position: relative;
                                display: flex;
                                /* padding: 0 30rpx; */
                                min-height: 100rpx;
                                /* background-color: #ffffff; */
                                /* justify-content: space-between; */
                                align-items: center;
                                font-size: 30rpx;
                                line-height: 1.6em;
                                flex: 1;
    
                                .bxImg {
                                    display: inline-block;
                                    margin-right: 10rpx;
                                    width: 1.6em;
                                    text-align: center;
                                }
                            }
    
                        }
                    }
    
                    .center-box {
                        color: #333333;
                        width: 700rpx;
                        background-color: #FFFFFF;
                        margin: 0 auto;
                        border-radius: 20rpx;
                        padding: 0rpx 30rpx 0rpx;
                        position: relative;
                        margin-top: 20rpx;
                    }
                }
            </style>
  3. 将对应的函数和变量添加上

  4. 项目index.vue有现成的示例,可进行修改

  5. 一定要在web中设置地图参数

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问