小程序的登录页面与个人中心页面的交互

表单的验证

1. 前端验证
   // 手机表单数据
   let {phone, password} = this.data
   // 验证密码为空
   if(!phone) {
   wx.showToast({
   title: ‘手机号不能为空’,
   icon: ‘none’,
   })
   return;
   }
   // 验证是否为手机号
   let phoneReg = /^1(3|4|5|6|7|8|9)\d{9}$/
   if(!phoneReg.test(phone)){
   wx.showToast({
   title: ‘手机号不正确’,
   icon: ‘none’,
   })
   return;
   }
   // 验证密码是否为空
   if(!password){
   wx.showToast({
   title: ‘密码不能为空’,
   icon: ‘none’,
   })
   return;
   }
2. 前端验证成功提交后端
   // 后端验证
   let loginResult = await request(’/login/cellphone’,{phone,password})
   if(loginResult.code === 200){
   wx.showToast({
   title: ‘登录成功’,
   });
3. 将服务器传来的数据放置在本地存储上
   //将数据存储到本地
   //同步存储方法
   wx.setStorageSync(‘userInfo’,JSON.stringify(loginResult.profile))
   //跳转到个人中心页面
   wx.switchTab({
   url: ‘…/personal/personal’,
   })

在个人中心页面的交互

//获取本地存储内容
let infoData = wx.getStorageSync(‘userInfo’);
//判断是否有数据
if(infoData){
this.setData({
usrInfoData: JSON.parse(infoData)
});
}

在wxml中使用