uni-app & vue2 记住密码功能

1. html代码

html 复制代码
<checkbox-group @change="checkboxChange">
	<label>
		<checkbox value="" :checked="ifSavePwd" style="transform: scale(0.6);"/>记住密码
	</label>
</checkbox-group>

2. js代码

默认复选款是不选中 在 data 里定义 SavePwd : false

javascript 复制代码
checkboxChange(e) {
	this.ifSavePwd = !this.ifSavePwd
	this.savePwd()
},

savePwd() {
	uni.setStorageSync('ifSavePwd', this.ifSavePwd)
	if (this.ifSavePwd === true) {
		console.log('保存用户密码')
		if (this.username) {
			uni.setStorageSync('username', this.username)
		}
		if (this.password) {
			uni.setStorageSync('password', this.password)
		}
	} else if (this.ifSavePwd === false) {
		console.log('无需保存用户密码')
		uni.removeStorageSync('username')
		uni.removeStorageSync('password')
	}
},

3. 效果

相关推荐
lemon_sjdk35 分钟前
DOM 节点
java·前端·javascript
nvd1136 分钟前
深入现代 Web 鉴权架构:网关统一代理 (Forward-Auth) vs 前端持有 JWT 的终极选型与边缘同域实践
前端·架构·状态模式
leoZ2311 小时前
2026-09-09-springboot-cloud-deploy-pitfalls
java·前端·javascript·vue.js·人工智能·spring boot·后端
YWL1 小时前
OpenLayers弹窗Overlay深度实战
前端·vue·openlayers
YWL2 小时前
OpenLayers+ECharts联动:地图点击联动图表,数据可视化大屏方案
前端·信息可视化·vue·echarts·openlayers
芭拉拉小魔仙2 小时前
Vue 2 门诊收费系统中的医保结算流程设计与实践
前端·javascript·vue.js
moonrailgun2 小时前
用 Node.js 复刻 Codex Astra 的终端星光
前端·javascript·算法
海上彼尚2 小时前
Cursor 模型的强度实测排行
前端·人工智能·后端
默_笙2 小时前
💫 给金鱼建图书馆(下):Milvus 向量数据库,让 AI 拥有长期记忆
前端·javascript
liangshanbo12153 小时前
手写 Function.prototype.call 与 Function.prototype.apply 面试题满分答案
开发语言·javascript·原型模式