用户登录

打开项目的 Profile 页面 .. 在 componentWillMount 这个生命周期方法里面 .. 给获取到的 token 这个 storage 数据起个名字 .. tokenStorage

然后在控制台上输出这个 Storage 数据 .. 回到模拟器 .. 刷新一下 .. 控制台上输出的就是 tokenStorage 数据 .. 获取到的 Storage 数据里面,有个 errMsg .. 如果正确的获取到了 Storage ,这个 errorMsg 的值应该是 getStorage:ok ..

Storage 里真正的数据是在 data 这个属性里面 .. 现在它里面有 id,username,还有一个 token 值 ..

下面从 Storage 数据里面,把 username 解构出来 .. 它是在 tokenStorage 里的 data 属性里面 ..

判断一下 ... 如果有 username .. 就去执行一下 this.setState .. 把页面的 username 这个 state 设置成 Token这个 Storage 里的 username 的值 ..

在页面上添加一个 state .. 里面添加一个 username ..

找到页面的视图 .. 先把 username 从页面的 state 里解构出来 .. 页面要显示的文字可以判断一下 username 的值,如果有值,就显示这个 username .. 没值就显示原来的 UserProfile 这个字符 ..

回到开发者工具 .. 刷新一下 .. 现在页面上会显示 Token Storage 里的 username 的值 ..

打开 account 页面 .. 用户登录成功以后,可以执行一下 Taro.navigateBack .. 返回之前的页面 ..

在开发者工具的工具栏上,打开清缓存 .. 清空一下所有的数据 ..

刷新页面 .. 这次又会打开登录页面 .. 登录一下 .. 输入用户名,密码 ... 登录成功,会返回到这前的 Profile 页面 ..

虽然现在 Token 这个 Storage 里有 username ,但是 页面上现在还是会显示原来的 UserProfile ..

我们需要一种方法,在用户登录成功以后,更新一下这个 Profile 页面 ..

使用 Storage 里的数据《 电商小程序案例:注册与登录 》

统计

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

社会化网络

关于

微信订阅号

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