【uni-app2.0】实现登录页记住密码功能

news2024/11/26 23:32:53

使用uni-app的uni.setStorageSync()uni.getStorageSync()方法来存储和读取密码

  1. 在登录页中添加一个记住密码的u-checkbox选项,并在data里面添加一个rememberPwd的布尔值,在每次点击记住密码change的时候来记录用户的选择
    在这里插入图片描述
	<u-checkbox-group placement="column">
	  <u-checkbox
	    v-model="rememberPwd"
	    @change="rememberChange"
	    :checked="rememberPwd"
	    label="记住密码"
	    name="yes"
	  >
	  </u-checkbox>
	</u-checkbox-group>
	data() {
	  return {
	    loginForm: {
	      username: "",
	      password: "",
	    },
	    rememberPwd: false,
	  };
	},
	methods: {
	  rememberChange(i) {
	    this.rememberPwd = i;
	  },
	}
  1. 在点击登录按钮执行的事件中,使用uni.setStorageSync()方法将【用户名、密码、记住密码】存储在本地缓存中
	// 登录逻辑后
	if (this.rememberPwd) {
	  uni.setStorageSync("HBremember", this.rememberPwd);
	  uni.setStorageSync("HBusername", this.loginForm.username);
	  uni.setStorageSync("HBpassword", this.loginForm.password);
	} else {
	  // 销毁缓存中的账号、密码
	  uni.removeStorageSync("HBremember");
	  uni.removeStorageSync("HBusername");
	  uni.removeStorageSync("HBpassword");
	}
	// 再进行跳转等动作
  1. 在登录页的onLoad事件中,使用uni.getStorageSync()方法检查本地缓存中是否存储了rememberPwd的值,如果存储了,则将它赋值给rememberPwd的属性,再取和赋值用户名和密码
  onLoad() {
    //取出缓存中的账号、密码
    const HBremember = uni.getStorageSync("HBremember");
    const HBusername = uni.getStorageSync("HBusername");
    const HBpassword = uni.getStorageSync("HBpassword");
    if (HBremember && HBusername && HBpassword) {
      this.loginForm.username = HBusername;
      this.loginForm.password = HBpassword;
      this.rememberPwd = HBremember;
    }
  },

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/794023.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Spring Boot 自定义启动画面

文章目录 自定 Banner获取属性设置颜色实操关闭 Banner参考 我们启动项目的之后&#xff0c;会在控制台上看到类似下面的画面&#xff1a; 那么&#xff0c;我们是否可以自定义呢&#xff1f; 肯定可以 自定 Banner 上面的截图信息就是 Banner 信息&#xff0c;我们可以在项目…

JavaScript |(二)JavaScript自定义对象及函数 | 尚硅谷JavaScript基础实战

学习来源&#xff1a;尚硅谷JavaScript基础&实战丨JS入门到精通全套完整版 文章目录 &#x1f4da;自定义对象&#x1f407; 对象的分类&#x1f407;对象基本操作&#x1f407;对象的属性&#x1f407;基本和引用数据类型&#x1f407;对象字面量 &#x1f4da;函数&#…

边写代码边学习之全连接Dense

1. 全连接原理 全连接神经网络&#xff08;Fully Connected Neural Network&#xff09;是一种最基本的神经网络结构&#xff0c;也被称为多层感知器&#xff08;Multilayer Perceptron&#xff0c;MLP&#xff09;。其原理是模拟人脑神经元之间的连接方式&#xff0c;通过多个…

AI视频监控综合管理平台EasyCVR多分屏默认播放协议的配置优化

智能视频监控平台EasyCVR可拓展性强、开放度高&#xff0c;既能作为业务平台使用&#xff0c;也能作为视频能力层被调用和集成。视频监控综合管理平台兼容度高&#xff0c;支持自由调用、支持与第三方集成。在AI能力的接入上&#xff0c;TSINGSEE青犀视频平台可支持AI智能分析网…

SD NAND【商业】

SD NAND【商业】 前言版权推荐SD NAND外观NAND与TF卡的区别雷龙CS SD NAND(贴片式TF卡)性能体验及应用 最后 前言 2023-7-23 16:20:19 因为本人对硬件了解不是很多&#xff0c;所以该篇参考自官方文档。 以下内容源自《【商业】》 仅供学习交流使用 版权 禁止其他平台发布…

linux 学成之路(基础篇)(二十三)MySQL服务(下)

目录 一、用户权限管理概述 二、用户权限类型 三、用户赋予权限 四、删除权限 五、删除用户 一、用户权限管理概述 数据库用户权限管理是数据库系统中非常重要的一个方面&#xff0c;它用于控制不同用户访问和操作数据库的权限范围。数据库用户权限管理可以保护敏感数据和…

QT项目打包成软件进行发布的三种方式

目录 一、打包成绿色便携版 二、打包成单文件版 三、打包成可安装版本 本教程对应的IDE是Qt Creater。 保证绿色便携版能正常运行才能够打包成单文件版本和可安装版本。 一、打包成绿色便携版 特点&#xff1a;给别人发送的时候需要先制作成一个压缩包文件&#xff0c;解…

【javaSE】 递归与汉诺塔详解

目录 递归 生活中的故事 递归的概念 递归的必要条件 示例 递归执行过程分析 代码示例 递归练习 练习一 执行过程图 练习二 执行过程图 练习三 执行流程图 ​编辑斐波那契数列 汉诺塔 汉诺塔问题解析 总结 递归 关于递归博主在C语言部分也进行了详解&#xff…

Rabbit MQ整合springBoot

一、pom依赖二、消费端2.1、application.properties 配置文件2.2、消费端核心组件 三、生产端3.1、application.properties 配置文件2.2、生产者 MQ消息发送组件四、测试1、生产端控制台2、消费端控制台 一、pom依赖 <dependency><groupId>org.springframework.boo…

【lesson4】linux权限

文章目录 权限权限是什么&#xff1f;对人权限对角色和文件权限权限修改改属性改人 权限 权限分为两种对人权限和对角色和文件的权限 权限是什么&#xff1f; 在脑海中我们对权限有一定的理解那么权限的定义到底是什么我们却说不出来&#xff0c;接下来我们来举个例子介绍一…

黑客和网络安全学习资源,限时免费领取,点这里!

统计数据显示&#xff0c;目前我国网安人才缺口达140万之多… 不管你是网络安全爱好者还是有一定工作经验的从业人员 不管你是刚毕业的行业小白还是想跳槽的专业人员 都需要这份超级超级全面的资料 几乎打败了市面上90%的自学资料 并覆盖了整个网络安全学习范畴 来 收藏它&…

MySQL基础(三)用户权限管理

目录 前言 一、概述 二、用户权限类型 1.CREATE 2.DROP 三、用户赋权 例子 四、权限删除 例子 五、用户删除 例子 总结 前言 关于MySQL的权限简单的理解就是MySQL允许你做你权利以内的事情&#xff0c;不可以越界。MySQL服务器通过权限表来控制用户对数据库的访问&…

[SSM]Spring中的JabcTemplate

目录 十三、JdbcTemplate 13.1环境准备 13.2新增 13.3修改 13.4删除 13.5查询 13.6查询一个值 13.7批量添加 13.8批量修改 13.9批量删除 13.10使用回调函数 13.11使用德鲁伊连接池 十三、JdbcTemplate JdbcTemplate是Spring提供的一个JDBC模板类&#xff0c;是对JDBC…

如何使用一个数据库构建一个消耗大量IOPS的应用程序

​我很喜欢关于社交媒体和数据库的创作主意。所以&#xff0c;让我们以一个新的方向来探索&#xff1a;看看Twitch.tv或任何具有即时通讯功能的平台。如果你刚开始接触数据库&#xff0c;可以阅读之前的那篇文章&#xff1a;社交媒体中的“点赞”“喜欢”是如何存储在数据库中的…

ubuntu开机自启动

ubuntu开机自启动 1、建一个test.sh脚本&#xff0c;并写入 #!/bin/sh gnome-terminal -x bash -c ‘cd /home/文件路径/;python3 main.py’ exit 0 2、:wq!保存 3、创建rc-local.service文件&#xff08;sudo vim /etc/systemd/system/rc-local.service&#xff09;&#xf…

Python post请求发送的是Form Data的类型

常规的Form Data 大部分的Form Data 可以直接都是可以通过正常的post请求进行提交的 import requestsheaders {自己设置的请求头键: 自己设置的请求头键,Content-Type: 网页接受的数据类型 }form_data {对应的键1&#xff1a;对应的值1,对应的键2&#xff1a;对应的值2, }r…

【C++】C++11右值引用|新增默认成员函数|可变参数模版|lambda表达式

文章目录 1. 右值引用和移动语义1.1 左值引用和右值引用1.2 左值引用和右值引用的比较1.3右值引用的使用场景和意义1.4 左值引用和右值引用的深入使用场景分析1.5 完美转发1.5.1 万能引用1.5.2 完美转发 2. 新的类功能2.1 默认成员函数2.2 类成员变量初始化2.3 强制生成默认函数…

(链表) 剑指 Offer 25. 合并两个排序的链表 ——【Leetcode每日一题】

❓剑指 Offer 25. 合并两个排序的链表 难度&#xff1a;简单 输入两个递增排序的链表&#xff0c;合并这两个链表并使新链表中的节点仍然是递增排序的。 示例1&#xff1a; 输入&#xff1a;1->2->4, 1->3->4 输出&#xff1a;1->1->2->3->4->4 …

畅捷通TPlus DownloadProxy.aspx 存在任意文件读取漏洞 附POC

文章目录 畅捷通TPlus DownloadProxy.aspx 存在任意文件读取漏洞 附POC1. 畅捷通TPlus DownloadProxy.aspx 简介2.漏洞描述3.影响版本4.fofa查询语句5.漏洞复现6.POC&EXP7.整改意见8.往期回顾 畅捷通TPlus DownloadProxy.aspx 存在任意文件读取漏洞 附POC 免责声明&#x…

Unity Profiler或UPR连接WebGL应用出错

问题 在使用Unity Build出WebGL应用进行性能测试的时候&#xff0c;勾选上了 Development Build和Autoconnect Profiler&#xff0c;分别使用Profiler和UPR进行测试 现象 使用Profiler测试时&#xff0c;就收到几帧&#xff0c;然后就没了 使用UPR进行测试时&#xff0c;在…