用户登录

按一下个人信息页面上的这个 退出 按钮可以退出登录 .. 回到项目 .. 打开 app.js .. 在这里先添加一个方法 .. 名字可以是 removeJWT ..

在这个方法里用一下 wx 的 removeStorageSync .. 删除掉小程序的 storage 里面的 jwt 这个数据 .. 登录以后我们把得到的 token 数据放在了这个 jwt 数据里了 ..

退出登录的时候可以删除掉这个数据 .. 然后再设置一下全局数据里面的这个 jwt,让它等于一个空白的对象 ..

在找到个人档案页面的视图 .. 在这个退出按钮的上面,给它绑定一个 tap 事件 .. 用 onTapLogoutButton 这个方法来处理..

在这个 登录 按钮的上面也可以绑定一个 tap 事件 .. 使用页面上的 onTapLoginButton 方法来处理 ...

然后到页面上定义这两个事件处理方法 ..

添加一个 onTapLogoutButton .. 在这个方法里可以用一下小程序里面的 removeJWT .. 在页面的最上面,可以把这个 removeJWT 从 app 里面拿出来用一下 ..

然后在登出按钮的事件处理里面用一下这个 removeJWT ..

登出以后 .. 我们可以再重新设置一下页面上显示的数据 .. 用一下 this.setData .. 重新把 user_nicename .. 设置成一个空白的字符 .. 再把 user_email 也设置成一个空白的字符 ..

user_avatar 可以设置成一个空白的对象 ... user_caps ,也把它设置成一个空白的对象 ..

下面再去定义登录按钮的事件处理方法 .. 名字是 onTapLoginButton ..

在这个方法里面,用一下 wx.navigateTo .. 打开一个页面 .. 页面上 /pages/users/login ...

预览

再到模拟器上去试一下 .. 打开个人档案页面 .. 按一下退出 .. 这样会执行小程序里面的 removeJWT ,清除掉 storage 里的 jwt 里面的数据 ..

同时我们设置了这个页面上的数据,所以页面上会立即做出反应 .. 之前显示的 退出 按钮,会变成登录按钮 ..

刷新一下小程序 ... 然后再打开这个,个人档案页面 ..

页面上显示的是用户未登录的状态 ..

按一下 登录 .. 可以打开登录页面 ..

输入用户名 ... 还有密码 .. 按一下 登录 .. 成功以后会返回到个人档案页面 .. 页面上又会显示出用户的相关信息 ..

再刷新一下小程序 ...

打开个人档案页面 .. 页面上仍然会显示用户的登录状态 ...

退出登录《 微信小程序:身份验证 #3 》

统计

13299
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点