【12.20】转行小白历险记 登录+注册页

一、登录+注册页面逻辑

  • 写样式布局:垂直居中、编程式路由、调后端接口
  • 正则表达式验证用户输入的密码规则
  • 校验通过后,跳转页面
  • js兜底校验调后端接口
  • 将token值存储到vuex中,实现持久化存储
    • vuex不是持久化存储的,如果需要持久化存储需要加入插件
    • 果不做持久化插件,刷新后token值会失效

 二、基于elenment-plus的组件封装

2.1场景:后台管理系统中用到了大量的表单

  • 登录、注册、更改密码、内涝展示事件
  • 数据驱动设计表单
    • 数据分为
      • 数据层+业务层+样式层
    • 结构设计上:
      • 通过template+v-if对表单的结构进行修改

三、退出登录

  1.       核心思路:退出登录就是清除vuex和本地所有缓存的值,然后页面强制切换到登录页面

参考课程:项目_17_布局_获取用户信息_哔哩哔哩_bilibili

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

IDEA的facets和artifacts

在软件开发领域,IDEA 是指 JetBrains 公司的 IntelliJ IDEA,是一款流行的集成开发环境(Integrated Development Environment)。在 IntelliJ IDEA 中,"facets" 和 "artifacts" 是两个概念&#xff…

力扣面试经典题之二叉树

104. 二叉树的最大深度 简单 给定一个二叉树 root ,返回其最大深度。 二叉树的 最大深度 是指从根节点到最远叶子节点的最长路径上的节点数。 示例 1: 输入:root [3,9,20,null,null,15,7] 输出:3示例 2: 输入&#xf…

【LearnOpenGL基础入门——4】绘制几何图形

目录 一.元素缓冲对象 二.线框模式绘制(Wireframe Mode) 三.绘制两个彼此相连的三角形 一.元素缓冲对象 元素缓冲对象(Element Buffer Object,EBO),也叫索引缓冲对象(Index Buffer Object,IBO)。假设我们不再绘制一个简单三角形而是绘制一…

51单片机项目设计:基于51单片机 无线防盗报警器设计

文章目录 项目背景一、项目功能二、材料选择三、接收设备原理图设计四、发送设备原理图设计四、PCB设计五、程序设计 哔哩哔哩视频链接: https://www.bilibili.com/video/BV1Wc411C7xH/?vd_sourcee5082ef80535e952b2a4301746491be0 实物链接:https://m…

机场信息集成系统系列介绍(7):机场航班信息显示系统FIDS

目录 一、简介 二、架构及相关功能 1、实时更新和显示航班信息 2、多屏显示与查询 3、提供登机口导航信息 4、发布机场公告 5、集成机场的其他延伸服务 6、支持多语言显示 7、监控与故障处理 8、数据分析与优化 9、与航空公司、地面代理的信息交互 10、安全保障与应…

大模型工具_awesome-chatgpt-prompts-zh

https://github.com/PlexPt/awesome-chatgpt-prompts-zh 1 功能 整体功能,想解决什么问题 ChatGPT 中文调教指南:提供一些常用的使用场景及对应的 Prompt 提示 当前解决了什么问题,哪些问题解决不了 针对想解决实际问题,但不知道…

WebAssembly 的魅力:高效、安全、跨平台(上)

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云…

若依vue如何展示一个HTML页面(或者展示Markdown文档)

一. 前言 ⚠ 本文是展示Markdown的方法,不能直接前端编辑Markdown文档. 二. 准备部分 用Typora编辑器打开需要导出html页面,我这里使用Typora来导出 1. 先将md文件导出成html 2. 将导出好的文件放在若依vue的pubilc下(文件可以是中文) 三. 代码部分 1.使用v-html来展示HT…

目标检测应用场景—数据集【NO.23】路面缺陷检测数据集

写在前面:数据集对应应用场景,不同的应用场景有不同的检测难点以及对应改进方法,本系列整理汇总领域内的数据集,方便大家下载数据集,若无法下载可关注后私信领取。关注免费领取整理好的数据集资料!今天分享…

Pycharm解释器的配置: System Intgerpreter 、Pipenv Environment、Virtualenv Environment

文章目录 前提1. 环境准备2. 了解虚拟环境 一、进入Interpreter设置页二、添加Interpreter1. 方式一2. 方式二 三、 System Interpreter四、 Pipenv Environment前提条件:详细步骤1) 选择pipenv2) 设置Base Interpreter3) 设置Pip…

opencv入门到精通——图像的几何变换

目录 目标 变换 缩放 平移 旋转 仿射变换 透视变换 目标 学习将不同的几何变换应用到图像上,如平移、旋转、仿射变换等。 你会看到这些函数: cv.getPerspectiveTransform 变换 OpenCV提供了两个转换函数cv.warpAffine和cv.warpPerspective,您…

【Linux/gcc】C/C++——编译过程

前提:WSL2(Ubuntu)、gcc编译器。gcc安装命令: sudo apt-get install gcc 查看gcc版本: 目录 1、编译过程 1.1、预处理 1.2、编译与汇编 1.3、链接 2、gcc实验 2.1、预处理 2.2、编译 2.3、汇编 2.4、链接 1、…

软件体系结构复习

数据持久化 ORM基本概念 对象关系映射(Object Relational Mapping,简称ORM)模式是为了解决面向对象和关系数据库存在的互不匹配的现象的技术。 换言之,ORM是通过使用描述对象和数据库之间映射的元数据,把程序中的对象…

使用OpenCV4实现工业缺陷检测的六种方法

目录 1 机器视觉2 缺陷检测3 工业上常见缺陷检测方法 1 机器视觉 机器视觉是使用各种工业相机,结合传感器跟电气信号实现替代传统人工,完成对象识别、计数、测量、缺陷检测、引导定位与抓取等任务。其中工业品的缺陷检测极大的依赖人工完成,…

前端 JS 安全对抗原理与实践

作者:vivo 互联网安全团队- Luo Bingsong 前端代码都是公开的,为了提高代码的破解成本、保证JS代码里的一些重要逻辑不被居心叵测的人利用,需要使用一些加密和混淆的防护手段。 一、概念解析 1.1 什么是接口加密 如今这个时代,…

三级安全教育二维码的应用

三级安全教育是指公司、项目经理部、施工班组三个层次的安全教育,是工人进场上岗前必备的过程,属于施工现场实名制管理的重要一环,也是工地管理中的核心部分之一,目前很多公司已经逐步开始使用系统来进行管理,下面我们…

pycharm git 版本回退

参考 https://blog.csdn.net/qq_38175912/article/details/102860195 yoyoketang 悠悠课堂

Redis可视化工具Redis Desktop Manager mac功能特色

Redis Desktop Manager mac是一款非常实用的Redis可视化工具。RDM支持SSL / TLS加密,SSH隧道,基于SSH隧道的TLS,为您提供了一个易于使用的GUI,可以访问您的Redis数据库并执行一些基本操作:将键视为树,CRUD键…

计算机毕业设计------JSP教务处学生成绩管理系统

项目介绍 本项目包含管理员、教师、学生三种角色; 用户角色包含以下功能: 修改密码,查看自己的信息,查看自己的成绩,登录界面等功能。 管理员角色包含以下功能: 修改示例,增删改查学生信息,增删改查教师信息,增删改查课程信息,管理员修改…

面试官95%会问的接口测试知识!

接口测试最近几年被炒的火热了,越来越多的测试同行意识到接口测试的重要性。接口测试为什么会如此重要呢? 主要是平常的功能点点点,大家水平都一样,是个人都能点,面试时候如果问你平常在公司怎么测试的,你除…