<el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm loginFrom"> <h1 style="font-size: 1.5rem;color: #fff;font-weight: bold;padding: 1rem 0;">登陸</h1> <el-form-item >  <el-input placeholder="賬號" v-model="ruleForm.userName"></el-input> </el-form-item> <el-form-item>  <el-input type="password" v-model="ruleForm.password" placeholder="密碼"></el-input> </el-form-item> <div style="padding: 1rem 0 2rem 0;" class="clear">  <span class="lf" style="color:#0489cc;">幫助</span>  <div class="rt">   <el-checkbox v-model="checked" style="color:#a0a0a0;">一周內(nèi)自動登錄</el-checkbox>   <span @click="clearCookie" style="cursor: pointer;color: #f19149;font-size: 0.75rem;margin-left: 5px;">忘記密碼？</span>  </div> </div> <el-button type="primary" @click="submitForm('ruleForm')" style="width: 100%;">登陸</el-button></el-form>

 data () { return {   ruleForm: {    userName: '', //用戶名    password: '' //密碼   }, }}methods: {  //點(diǎn)擊登錄調(diào)用方法  submitForm(formName) {    //保存的賬號    var name=this.ruleForm.userName;    //保存的密碼    var pass=this.ruleForm.password;    if(name==''||name==null){     alert("請輸入正確的用戶名");     return    }else if(pass==''||pass==null) {     alert("請輸入正確的密碼");     return    }    //判斷復(fù)選框是否被勾選 勾選則調(diào)用配置cookie方法    if(this.checked=true){      //傳入賬號名，密碼，和保存天數(shù)3個參數(shù)     this.setCookie(name,pass,7);    }    //接口    var url='myserver/user/login';    this.$http.post(url,this.ruleForm,{emulateJSON:true})     .then(res=>{      if(res.body=="fail"){       alert("用戶名或密碼錯誤,請重新輸入");       this.ruleForm.userName='';       this.ruleForm.password='';       return      } else{      alert（"登陸成功！"）       this.$router.push("/index")      }   });  },//設(shè)置cookie setCookie(c_name,c_pwd,exdays) {  var exdate=new Date();//獲取時間  exdate.setTime(exdate.getTime() + 24*60*60*1000*exdays);//保存的天數(shù)  //字符串拼接cookie  window.document.cookie="userName"+ "=" +c_name+";path=/;expires="+exdate.toGMTString();  window.document.cookie="userPwd"+"="+c_pwd+";path=/;expires="+exdate.toGMTString(); }, //讀取cookie getCookie:function () {  if (document.cookie.length>0) {   var arr=document.cookie.split('; ');//這里顯示的格式需要切割一下自己可輸出看下   for(var i=0;i<arr.length;i++){    var arr2=arr[i].split('=');//再次切割    //判斷查找相對應(yīng)的值    if(arr2[0]=='userName'){     this.ruleForm.userName=arr2[1];//保存到保存數(shù)據(jù)的地方    }else if(arr2[0]=='userPwd'){     this.ruleForm.password=arr2[1];    }   }  } }, //清除cookie clearCookie:function () {  this.setCookie("","",-1);//修改2值都為空，天數(shù)為負(fù)1天就好了 }},//頁面加載調(diào)用獲取cookie值mounted(){    this.getCookie()    }