2020-02-26

案例3
知识点：
跳转页面时，
wx.navigateTo({url:”…/login/login”})
账号密码赋值给APP数据：
this.setDat({username:app.appData.userinfo.username})
用户名和密码验证的过程：
loginBtnCllick:function(){
App.appData.userinfo={username:this.data.username,passworda:this.data.password}
wx.redirectTol({url:”…/user/user”})
}
 
总结：
1.运用到配置页面，window信息以及tabBar，每个页面有自己的配置覆盖全局的配置
2.users生命周期
在onunload里判断当前用户是否存在，若不存在跳转到登录页面，若存在，在当前页面设置值
onlond:function(options){
If(app.appData.useinfonull){
wx.redirectTol({url:”…/login/login”})
}else{
this.setDatal({username:app.appData.userinfo.username})
}
}
3.事件的绑定
登录页面按钮绑定了点击的事件，
＜button class = “login-btn” bindtap＝“loginBtnClick”＞登录＜/button＞
在输入框框里面绑定了input事件，
＜input style = “flex-grow:1” password＝“true” bindinput＝“passwordInput”/＞
Input事件触发会获得输入框中的数据，并给username赋值
usernameInput：funtion(event){this.setData({username.event.detail.value})}
登录以后重新跳回用户中心页面
loginBtnCllick:function(){
App.appData.userinfo={username:this.data.username,passworda:this.data.password}
wx.redirectTol({url:”…/user/user”})
}
之后用户触发onLoad
onlond:function(options){
If(app.appData.useinfonull){
wx.redirectTol({url:”…/login/login”})
}else{
this.setDatal({username:app.appData.userinfo.username})
}
}
之后用户名将正常显示
小结：通过该案例，知道微信小程序如何进行页面跳转，并知道如何通过编程语言将输入的账号密码数据传到系统数据中，并准确的显示在用户页面上。