1

html

<div v-if="tab === 2">
  <el-input prefix-icon="el-icon-user" v-model="form.userName" placeholder="请输入账户" @input="changeUserName"></el-input>
  <el-input prefix-icon="el-icon-lock" v-model="form.passWord" show-password placeholder="请输入密码"></el-input>
  <p class="other">
    <span><el-checkbox v-model="autoSub">自动登陆</el-checkbox></span>
    <span>忘记密码</span>
  </p>
</div>

代码内容:

export default {
    name: 'login',
    data () {
        return {
            form: {
                userName: '', // 账号
                passWord: '' // 密码
            }
        }
    },
    mounted() {
        this.account(); //获取cookie的方法
    },
    methods:{
        onSubmit() {
            if (this.autoSub == true) {
                  //存入cookie
                  this.setCookie(this.form.userName, this.form.passWord, 7); //保存7天
            } else {
                    this.clearCookie();
            }
            // 这里进行登录请求
        },
        // username修改后重置密码和自动登录
        changeUserName(val) {
            this.form.passWord = '';
            this.autoSub = false
        },
        // cookie中获取记住密码信息
        account() {
            if (this.getCookie("username")) {
                this.form.userName = this.getCookie("username");
                this.form.passWord = this.getCookie("password");
                this.autoSub = true
            } else {
                this.autoSub = false
            }
        },
        // 存储cookie
        setCookie(c_name, c_pwd, exdate) {
            //账号,密码 ,过期的天数
            var exdate = new Date();
            exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdate); //保存的天数
            document.cookie =
                "username=" + c_name + ";path=/;expires=" + exdate.toLocaleString();
            document.cookie =
                "password=" + c_pwd + ";path=/;expires=" + exdate.toLocaleString();
        },
        // 获取cookie
        getCookie(name) {
            let arr = document.cookie.split(";");
            for (let i = 0; i < arr.length; i++) {
                let arr2 = arr[i].split("=");
                if (arr2[0].trim() == name) {
                    return arr2[1];
                }
            }
        },
        // 清除cookie
        clearCookie() {
            this.setCookie("", "", -1); //清除cookie
        },
    }
}

柴门闻犬吠
32 声望2 粉丝

敬所有悬而未决的人生