当前位置: 首页 > news >正文

修改密码和再次确认密码的js和element-ui的使用

请添加图片描述

<template><div><!-- plan的插槽 --><plan title="修改密码"><!-- 插槽的名字 --><span slot="header">修改密码</span><el-form:model="ruleForm2"status-icon:rules="rules2"ref="ruleForm2"label-width="100px"class="demo-ruleForm"><el-form-item label="原密码" prop="oldPwd"><el-input v-model="ruleForm2.oldPwd"></el-input></el-form-item><el-form-item label="新密码" prop="newPwd"><el-input v-model="ruleForm2.newPwd"></el-input></el-form-item><el-form-item label="确认密码" prop="checkPass"><el-input v-model="ruleForm2.checkPass"></el-input></el-form-item><el-form-item><el-button type="primary" @click="submitForm()">提交</el-button><el-button @click="resetForm('ruleForm2')">重置</el-button></el-form-item></el-form></plan></div>
</template><script>
import { checkoldpwd, editpwd } from "@/api/account.api";
export default {data() {// 检查旧密码是否正确let validatePass = (rule, value, callback) => {checkoldpwd(value).then(res => {console.log(res);if (res.data.code === 200) {callback();} else {callback(new Error("密码不正确"));}});};// 检查新密码let validateNewpwd = (rule, value, callback) => {if (this.ruleForm2.checkPass) {this.$refs.ruleForm2.validateField("checkPass");}callback();};// 检查两次密码是否一样let validateCheckpwd = (rule, value, callback) => {if (value === this.ruleForm2.newPwd) {callback();} else {callback(new Error("密码不一"));}};return {ruleForm2: {oldPwd: "",newPwd: "",checkPass: ""},rules2: {oldPwd: [{ required: true, message: "请输入账号", trigger: "blur" },{ validator: validatePass, trigger: "blur" }],newPwd: [{ required: true, message: "请输入新密码", trigger: "change" },{ validator: validateNewpwd, trigger: "change" }],checkPass: [{ required: true, message: "请确认密码", trigger: "change" },{ validator: validateCheckpwd, trigger: "change" }]}};},// 提交验证methods: {submitForm(formName) {this.$refs.ruleForm2.validate(valid => {if (valid) {editpwd(this.ruleForm2.newPwd).then(res => {if (res.data.code === 0) {this.$router.push("/login");}});}});},resetForm(formName) {this.$refs[formName].resetFields();}}
};
</script><style lang="scss" scoped>
</style>

相关文章:

修改密码和再次确认密码的js和element-ui的使用

<template><div><!-- plan的插槽 --><plan title"修改密码"><!-- 插槽的名字 --><span slot"header">修改密码</span><el-form:model"ruleForm2"status-icon:rules"rules2"ref"rul…...

蓝桥杯专题-真题版含答案-【垒骰子_动态规划】【抽签】【平方怪圈】【凑算式】

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例点击跳转>软考全系列点击跳转>蓝桥系列 &#x1f449;关于作者 专注于Android/Unity和各种游…...

kubernetes调试利器——kubectl debug工具

通常情况下&#xff0c;业务容器所使用的镜像是非常精简的&#xff0c;而一旦业务容器出现问题&#xff0c;通过kubectl exec进入到容器时&#xff0c;我们会发现自己需要使用的工具都没有&#xff0c;也无法通过apt, apt-get, yum等包管理工具下载需要的工具。 想要解决这个尴…...

浅谈es5如何保证并发请求的返回顺序

最近在公司实习写的是es5&#xff0c;在和回调地狱经过一番拉扯之后写下这篇文章&#xff0c;也算是体验了一把没有promise的时代 假设我们的div有一个日历列表&#xff0c;但是由于大小关系只能每次显示2天的信息&#xff0c;项目限制只能使用es5&#xff0c;不能使用es6的pro…...

深入浅出Pytorch函数——torch.squeeze

分类目录&#xff1a;《深入浅出Pytorch函数》总目录 相关文章&#xff1a; 深入浅出Pytorch函数——torch.squeeze 深入浅出Pytorch函数——torch.unsqueeze 将输入张量形状为1的维度去除并返回。比如输入向量的形状为 A 1 B 1 C 1 D A\times1\times B\times1\times C…...

【LeetCode】121.买卖股票的最佳时机

题目 给定一个数组 prices &#xff0c;它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票&#xff0c;并选择在 未来的某一个不同的日子 卖出该股票。设计一个算法来计算你所能获取的最大利润。 返回你可以从这笔交易中获取的最大…...

【力扣】74. 搜索二维矩阵 <二分法>

【力扣】74. 搜索二维矩阵 给你一个满足下述两条属性的 m x n 整数矩阵&#xff1a; 每行中的整数从左到右按非递减顺序排列。每行的第一个整数大于前一行的最后一个整数。 给你一个整数 target &#xff0c;如果 target 在矩阵中&#xff0c;返回 true &#xff1b;否则&am…...

Spring Task+Cron表达式

不需要导入坐标spring-context&#xff08;包含在了spring-boot-starter&#xff09; 在启动类添加EnableScheduleing开启任务调度 单独建个定时任务包task&#xff0c;创建定时任务类MyTask 在定时任务类添加Component 在类的方法上添加Scheduled&#xff08;cron “cron表达…...

你们公司的【前端项目】是如何做测试的?字节10年测试经验的我这样做的...

前端项目也叫web端项目&#xff08;通俗讲就是网页上的功能&#xff09;是我们能够在屏幕上看到并产生交互的体验。 前端项目如何做测试&#xff1f; 要讲清楚这个问题&#xff0c;先需要你对测试流程现有一个全局的了解&#xff0c;先上一张测试流程图&#xff1a; 测试流程…...

华为战略方法论:BLM模型之关键任务与依赖关系

内容简介 在 BLM 模型中&#xff0c;执行部分包括四个模块&#xff0c;分别是&#xff1a; 关键任务与依赖关系&#xff1b;组织与绩效&#xff1b;人才&#xff1b;氛围与文化。 详细内容&#xff0c;大家可以参看下面这张图。 这四个模块其实是可以进一步划分成两个关键点…...

django的ORM模板的fake更新

django存量数据表的migraions记录丢失&#xff0c;若要更新表结构&#xff0c;则需用到fake&#xff0c;否则报错&#xff1a; 解决步骤如下&#xff1a; 1&#xff09;同步存量表结构&#xff0c;生成伪表 --fake sudo python3 manage.py makemigrations appname sudo pyt…...

239.滑动窗口最大值

leetcode原题链接 题目描述&#xff1a; 给你一个整数数组 nums&#xff0c;有一个大小为 k 的滑动窗口从数组的最左侧移动到数组的最右侧。你只可以看到在滑动窗口内的 k 个数字。滑动窗口每次只向右移动一位。 返回 滑动窗口中的最大值 。 示例1: 输入&#xff1a;nums [1,…...

Redis基础原理

1 概念 1.1 关系型数据库与非关系型数据库对比 关系型数据库Mysql、Oralce特点数据之间有关联&#xff1b;数据存储在硬盘上效率操作关系型数据库非常耗时 非关系型数据库redis、hbase存储key:value特点数据之间没有关联关系&#xff1b;数据存储在内存中缓存思想从缓存中获…...

.NET 5 Web API 中JWT详细教程:保护你的Web应用

第一部分&#xff1a; 理解JWT JSON Web Token&#xff08;JWT&#xff09;是一种在不同系统之间传递信息的安全方式。它由三部分组成&#xff1a;头部&#xff08;Header&#xff09;、载荷&#xff08;Payload&#xff09;和签名&#xff08;Signature&#xff09;。头部包…...

MyBatis-Plus自动填充

文章目录 一、前言二、MyBatis-Plus自动填充功能实现2.1、实体类上增加注解2.2、自定义填充类编写 一、前言 我们在建表的时候&#xff0c;所有的表都会有create_id&#xff08;创建人id&#xff09;、create_time&#xff08;创建时间&#xff09;、update_id&#xff08;更新…...

Dubbo服务提供者失效踢出原理解析

Dubbo服务提供者失效踢出原理解析 在分布式系统中&#xff0c;服务提供者的失效是一个常见而且重要的问题。Dubbo作为一款优秀的分布式服务框架&#xff0c;提供了失效踢出机制来及时剔除不可用的服务提供者&#xff0c;确保系统的稳定性和可用性。本文将深入探讨Dubbo服务提供…...

el-select下拉框处理分页数据,触底加载更多

1、声明自定义指令&#xff1a; directives: {loadmore: {inserted(el, binding) {const SELECTWRAP_DOM el.querySelector(.el-select-dropdown .el-select-dropdown__wrap);SELECTWRAP_DOM.addEventListener(scroll, function() {const condition this.scrollHeight - thi…...

如何设计自动化测试脚本?一文5个步骤带你从0到1设计

企业中如何设计自动化测试脚本呢&#xff1f;今天我们就来为大家分享一些干货。 一、线性设计 线性脚本设计方式是以脚本的方式体现测试用例&#xff0c;是一种非结构化的编码方式&#xff0c;多数采用录制回放的方式&#xff0c;测试工程师通过录制回访的访问对被测系统进行自…...

PostgreSQL实战-数据库迁移部署

PostgreSQL实战-数据库迁移部署 介绍 根据项目需求&#xff0c;我们需要将现有的PostgreSQL数据库重新部署到新的服务器上。由于项目本身就是基于PostgreSQL数据库构建的&#xff0c;因此数据库迁移将变得十分便捷。接下来&#xff0c;我将简要介绍我们的迁移步骤。 迁移步骤…...

PHP数据库

PHP MySQL 连接数据库 MySQL 简介MySQL Create 免费的 MySQL 数据库通常是通过 PHP 来使用的。 连接到一个 MySQL 数据库 在您能够访问并处理数据库中的数据之前&#xff0c;您必须创建到达数据库的连接。 在 PHP 中&#xff0c;这个任务通过 mysql_connect() 函数完成。 …...

无机布防火卷帘门报价透明,包工包料,一次说清所有费用

很多客户在选购无机布防火卷帘门时&#xff0c;最关心实际成交价格&#xff0c;也担心报价不清晰&#xff0c;后期产生各类额外支出。行业内产品定价参差不齐&#xff0c;选材做工不同&#xff0c;最终价位自然存在差距&#xff0c;挑选时不能只看表面低价。 &#x1f449; 点击…...

Blender渲染通道完全指南:如何像电影后期一样,分离出深度、阴影与反射图

Blender渲染通道完全指南&#xff1a;影视级后期制作的深度解析在数字内容创作领域&#xff0c;Blender已经从一个简单的3D建模工具成长为能够处理复杂视觉特效的全流程解决方案。对于追求影视级质量的中高级用户而言&#xff0c;掌握渲染通道技术是提升作品专业度的关键一步。…...

[智能体-69]:重新认知MCP:协议不生产智能,只是AI全域交互的标准化基石

MCP只是提供了大模型、编排调度、外部工具能够进行结构化交流的标准&#xff0c;而整个系统的智能主要依赖编排调度&#xff0c;与外部软件系统的交互取决于外部工具&#xff0c;包括外部语音交互、视觉交互、数字化交互。当下MCP&#xff08;Model Context Protocol&#xff0…...

基于声卡与电流互感器的安全交流功率测量系统设计与实践

1. 项目概述&#xff1a;用声卡安全测量交流功率我一直对各种测量技术抱有浓厚的兴趣&#xff0c;毕竟“测量即认知”这句老话在今天依然适用。对于电力消耗和产出&#xff0c;没有什么比直接测量更能说明问题了。交流功率的测量&#xff0c;核心在于同时获取电压和电流的瞬时值…...

基于双T振荡器的正弦波LED调光电路设计与实践

1. 项目概述&#xff1a;用双T振荡器实现正弦波LED调光最近在捣鼓一些氛围灯项目&#xff0c;总感觉用单片机PWM做的呼吸灯效果有点“硬”&#xff0c;那种线性的明暗变化看久了难免审美疲劳。于是翻出以前模拟电路的老本行&#xff0c;琢磨着能不能用纯硬件的方式&#xff0c;…...

ModernWMS核心功能详解:从ASN入库到Dispatch出库的完整工作流

ModernWMS核心功能详解&#xff1a;从ASN入库到Dispatch出库的完整工作流 【免费下载链接】ModernWMS The open source simple and complete warehouse management system is derived from our many years of experience in implementing erp projects. We stripped the origin…...

模拟电路实现自主循线机器人:无MCU的硬件逻辑设计

1. 项目概述&#xff1a;用最纯粹的模拟电路&#xff0c;造一台会“思考”的机器人每次看到那些在赛道上灵巧穿梭的循线小车&#xff0c;你是不是也手痒&#xff0c;想自己动手做一个&#xff1f;但一听到“单片机”、“编程”、“Arduino”这些词&#xff0c;又觉得门槛太高&a…...

Claude Code + LM Studio + CC-Switch 本地自动化编程部署指南

Claude Code LM Studio CC-Switch 本地自动化编程部署指南 本指南汇总了在 Windows 本地环境下&#xff0c;使用 Claude Code 配合 LM Studio 本地模型、CC-Switch 代理进行自动化编程开发的完整配置方案。 目录 硬件与模型选型LM Studio 本地模型部署CC-Switch 代理配置Cla…...

为内部知识库问答机器人集成taotoken多模型能力的架构设计

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 为内部知识库问答机器人集成taotoken多模型能力的架构设计 应用场景类&#xff0c;探讨为企业内部知识库构建智能问答机器人时&…...

地理空间机器学习库全解析:从TorchGeo到Raster Vision的实战指南

1. 项目概述&#xff1a;为什么我们需要专门的地理空间机器学习库&#xff1f;如果你尝试过用标准的PyTorch或TensorFlow去处理一张卫星影像&#xff0c;大概率会在第一步就卡住。不是模型写不出来&#xff0c;而是数据根本读不进去&#xff0c;或者读进去了却对不上位置。一张…...