微信小程序授权登陆

阿圆啊哈

于 2019-03-31 15:45:08 发布

阅读量735

点赞数 2

分类专栏：学习

本文链接：https://blog.youkuaiyun.com/qq_43227109/article/details/88929543

版权

本文介绍了微信小程序的授权登录步骤。首先，在app.json中配置启动页面，确保授权页面优先加载。接着，用户点击授权按钮后，通过index.js的方法获取用户信息并更新UI。成功授权后，显示用户名和头像，同时可以进行页面跳转操作，只需在js文件中定义相应的方法。最终实现从登录页面平滑过渡到其他页面，并支持返回功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

微信小程序进来是需要扫码验证账号的既然有了账号就可以获取到

这里是app.json里哪个页面在前面就会加载哪个页面

{
  "pages": [
    "pages/list/list",
    "pages/index/index"
  ],
  "window": {
    "navigationBarBackgroundColor": "#489B81",
    "navigationBarTitleText": "阿圆网络",
    "navigationBarTextStyle": "black"
  }
}

首先是一个主页面当点击授权按钮就会获取用户信息然后隐藏掉授权按钮展示出来 452

然后在index.wxml设置样式其他是从js里面获取

<!--pages/index/index.wxml-->
<!--wxml里面放文本内容 app.json配置全局文件 index或其他页面配置自己的页面-->
<!--view容器-->
<!--冒泡事件 组件上的事件被触发bind 向父节点传递  非冒泡事件 组件触发不会向父节点传递catch  -->
<view class='indexContext'>
<image class='avatar' src='{
  {userInfo.avatarUrl}}'></image>
<!--一个验证开关 true就打开 false就隐藏-->
<button b