微信小程序---学生评教（显示个人信息、修改密码）

1.首先我们在app.json配置菜单项（评教和个人信息）：

"tabBar": {
    "list": [
      {
        "selectedIconPath": "images/ping.png",
        "iconPath": "images/ping.png",
        "pagePath": "pages/teachers/teachers",
        "text": "评教"
      },
      {
        "selectedIconPath": "images/user.png",
        "iconPath": "images/user.png",
        "pagePath": "pages/my/my",
        "text": "个人信息"
      }
    ]
  }

2.创建个人信息的页面：

  
  个人信息
    
 
        
            
            
                 姓名：{{name}} 
            
  
        
         
            
            
                 学号：{{no}} 
            
        
           
            
            
                 性别：男 
            
        
         
            
            
                 班级：{{ban}} 
            
        
         
            
            
                 系别：{{xi}}
            
        
         
            
            
                 班号：{{cc}}
            
        
           
            
            
                修改密码
            
        
          
            
            
                退出
            
        
    
  

3.在login.js修改跳转页面的方法：

原来是这样：

 wx.redirectTo({
       url: '../teachers/teachers',
  })

这样跳转是不起作用的，所以我们需要使用另一个方法：

wx.switchTab({
     url: '../teachers/teachers',
      })

这样我们就能得到任课老师的列表那个页面。

4.在my.js里，我们需要获取登陆的个人信息，所以需要使用以下代码：

onLoad: function (options) {
    var student = wx.getStorageSync('student');
    this.setData({no:student.student.no}),//获取学号
    this.setData({ name: student.student.name })//获取姓名
    this.setData({ cc: student.student.classid })//获取班号
    this.setData({ ban: student.student.classname })//获取班级
    this.setData({ xi: student.student.departmentname})//获取系别
  },

然后当我们点击修改密码时，会出现以下页面：

代码如下：

 

     
       
        
        
            输入原密码:
   
             
        
        
        
            输入新密码:
            
             
            
        
        
            请再次输入新密码:
            
              
            
        
        
            提交
        
    
    
    

样式：

/* pages/pwd/pwd.wxss */

     header {
                width: 100%;
                height: 70px;
                background: #F6BA40;
                color: white;
                line-height: 100px;
                text-align: center;
            }
            input{
              border:1px solid #CCC;
            }
        .all{
            position: relative;
            /*height: 370px;*/
            width: 100%;
            margin:0 auto;
            background:white;
        }
        .per{
            position: absolute;
            width: 80%;
            height: 50px;
            background: #337AB7;
            color:white;
            border-radius: 4px 4px 0 0;
        }
        .per span{
            position: absolute;
            left: 20px;
            top: 15px;
        }
        .content{
            position: absolute;
            top:30px;
            left:50px;
        }
        .change{
            font-weight: bold;
            margin-bottom: 20px;
            width:100%;
        }
        .change input{
            width:240px;
        }
        .input{
            position: absolute;
            top:200px;
            width:100%;
            text-align: center;

        }
        .input input{
            width:80%;
            height: 35px;
            line-height: 35px;
            font-weight: 100;
            background: #F6BA40;
            color: white;
            border-radius: 5px;
            outline: none;
            border:none;
        }

js代码如下：

当输入原密码和新密码，点击提交就会出现以下页面：

formSubmit:function(e){
    console.log(e)
   var oldpwd=e.detail.value.oldpwd;
   var newpwd =e.detail.value.newpwd;

   var newpwd1 =e.detail.value.newpwd1;
   if(oldpwd==''||newpwd==''|| newpwd1==''){
     wx.showToast({
       title: '密码不能为空',
       icon:'none',
       duration:1000
     })
   }else if(newpwd!=newpwd1){
     wx.showToast({
       title: '两次密码输入不一样',
       icon: 'none',
       duration: 1000
     })
   }else{
     var student = wx.getStorageSync('student');
     var no=student.student.no;

     var url ="接口url地址";
     wx.request({
       url: url,
       method:'POST',
       data:{
       no:no,
       oldpwd:oldpwd,
       newpwd:newpwd
       },
       header: {
         'content-type': 'application/x-www-form-urlencoded' // 默认值
       },
       success: function (res) {
        //  console.log(res.data)
         wx.showToast({
           title: res.data.msg,
           icon: 'none',
           duration: 2000,
         })
       }
     })
   }
  }

当我们点击退出时，清除缓存的数据，并且回到登陆页面，这样就使用

wx.clearStorage()清除缓存数据.