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

news2025/1/6 16:07:19

一、登录+注册页面逻辑

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

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

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

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

三、退出登录

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

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

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

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

相关文章

当下流行的直播技术demo演示

当下流行的直播技术demo演示

nginx-http-flv-module（更新不是很频繁） SRS: https://ossrs.net/lts/zh-cn/（独立官网，目前最新稳定版version5） 基于SRS搭建直播demo演示： 一、搭建流媒体服务器 参见官网：https://ossrs.ne…
阅读更多...
Windows 如何在局域网中建立NTP服务器实现时间同步(设置一台设备作为主机，其他设备作为从机来同步时间）

Windows 如何在局域网中建立NTP服务器实现时间同步(设置一台设备作为主机，其他设备作为从机来同步时间）

首先简单了解一下什么是NTP 网络时间协议(NTP)是一种用于同步计算机网络上各设备时间的协议。NTP时间同步在许多项目和应用中都是关键的，特别是那些对时间同步精度有要求的场景。比如需要使用NTP时间同步的情况有：金融交易系统、科学研究实验、工业自动…
阅读更多...
ROS笔记之rosbag的快速切片(C++实现)

ROS笔记之rosbag的快速切片(C++实现)

ROS笔记之rosbag的快速切片(C实现) —— 杭州 2023-12-21 夜 code review 文章目录 ROS笔记之rosbag的快速切片(C实现)1.运行效果2.文件结构3.fast_rosbag_slice.cpp4.CMakeLists.txt5.package.xml6.对fast_rosbag_slice.cpp进行函数封装 正常该功能是ROS官方命令行&#xff1a…
阅读更多...
pycharm下执行conda命令提示无法识别解决方案

pycharm下执行conda命令提示无法识别解决方案

1 问题描述 win10环境命令行执行conda命令，报命令无法识别，错误信息如下： PS D:\code\cv> conda activate pt conda : 无法将“conda”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写，如果包括路径&a…
阅读更多...
伽马校正：FPGA

伽马校正：FPGA

参考资料： Tone Mapping 与 Gamma Correction - 知乎 (zhihu.com) Book_VIP: 《基于MATLAB与FPGA的图像处理教程》此书是业内第一本基于MATLAB与FPGA的图像处理教程，第一本真正结合理论及算法加速方案，在Matlab验证，以及在FPGA上…
阅读更多...
106 uni-app 小程序之巨坑 not found path,not found methods v-for渲染出现报错

106 uni-app 小程序之巨坑 not found path,not found methods v-for渲染出现报错

1.Component is not found in path 你是否像我一样，检查了无数遍，引入路径检查千万遍，就是没写错，小程序后台就是给你报错， 不用慌，心里默念：我不能砸电脑，我不能砸电脑&#xff0…
阅读更多...
python可以做小程序研发嘛,python能做微信小程序吗

python可以做小程序研发嘛,python能做微信小程序吗

大家好，给大家分享一下python可以做微信小程序开发吗，很多人还不知道这一点。下面详细解释一下。现在让我们来看看！ 大家好，给大家分享一下用python编写一个小程序，很多人还不知道这一点。下面详细解释一下用python代码…
阅读更多...
[Spring 原理] 依赖查找

[Spring 原理] 依赖查找

在Spring框架中，依赖注入是一项非常重要的功能，它能够帮助我们解决对象之间的依赖关系。而其中的doResolveDependency方法是Spring框架中执行依赖注入的核心方法之一。本篇博客将对doResolveDependency方法进行详细介绍，帮助读者更好地理解和…
阅读更多...
手写题 - 实现一个带并发限制的异步调度器

手写题 - 实现一个带并发限制的异步调度器

题目 实现一个带并发限制的异步调度器 Scheduler，保证同时运行的任务最多有N个。 完善下面代码中的 Scheduler 类，使得以下程序能正确输出：class Scheduler {add(promiseCreator) { ... }// ... }const timeout (time) > new Promise(re…
阅读更多...
Python 爬虫之下载视频（二）

Python 爬虫之下载视频（二）

爬取某Y的视频链接和标题 文章目录 爬取某Y的视频链接和标题前言一、基本思路二、程序解析阶段三、程序处理阶段总结 前言 这篇内容就简单给大家写个如何从网页上爬取某B主 主页 页面上所有的视频链接和视频标题。 这篇是基础好好看，下篇会根据这篇的结果做一个批…
阅读更多...
八：爬虫-MySQL基础

八：爬虫-MySQL基础

一：MySQL数据库基础 1.MySQL数据库介绍 MySQL是一个[关系型数据库管理系统]，由瑞典MySQL AB 公司开发，属于 Oracle 旗下产品。MySQL 是最流行的关系型数据库管理系统之一，在 WEB 应用方面，MySQL是最好的 RDBMS (Rela…
阅读更多...
3D模型人物换装系统（二 优化材质球合批降低DrawCall）

3D模型人物换装系统（二 优化材质球合批降低DrawCall）

3D模型人物换装系统 介绍原理合批材质对比没有合批材质核心代码完整代码修改总结 介绍 本文使用2018.4.4和2020.3.26进行的测试 本文没有考虑法线贴图合并的问题，因为生成法线贴图有点问题，放在下一篇文章解决在进行优化 如果这里不太明白换装的流程可以…
阅读更多...
gem5 garnet l1 l2 cache的创建与相连

gem5 garnet l1 l2 cache的创建与相连

gem5 garnet l1 l2 cache的创建与相连 主要就是这个图： 细节 我们用的是gem5/configs/deprecated/example/fs.py #fs.py 引入了上两层路径，也就是当前可以看到 gem5/configs/路径。 addToPath("../../")#fs.py引入了gem5/configs/ruby/Ru…
阅读更多...
PIC单片机项目（8）——基于PIC16F877A的温度光照检测装置的protues仿真

PIC单片机项目（8）——基于PIC16F877A的温度光照检测装置的protues仿真

1.功能设计 使用PIC16F877A单片机，进行温度检测、光照检测。温度使用的是DS18B20，光照检测直接利用的AD转换。 光照太暗就开灯，温度太高就开风扇。温度阈值和光照阈值都实时显示在LCD1602屏幕上面。 完成了protues仿真。文件里面包含代码和仿…
阅读更多...
图片转excel：“保留数字格式”在什么场景下该勾

图片转excel：“保留数字格式”在什么场景下该勾

保留数字格式是什么意思呢？顾名思义，就是将转出来的数字保留为数字格式，而不是文本格式。我们知道，OCR程序将图片上的文字识别为电脑可编辑的文字后，如果导入到excel不加处理，则单个数字过长的文字就会被ex…
阅读更多...
Python整数常用的方法汇总与Python3 File(文件) 方法

Python整数常用的方法汇总与Python3 File(文件) 方法

Python整数常用的方法汇总 python３基础之整数常用的方法整理 希望对大家学习或者使用python3能具有一定的参考价值。 __abs__ #返回一个数的绝对值 __add__ #两数相加 __and__ #两数按位与操作 __bool__ …
阅读更多...
04-JVM字节码文件结构深度剖析

04-JVM字节码文件结构深度剖析

一、源代码 package com.tuling.jvm;public class TulingByteCode {private String userName;public String getUserName() {return userName;}public void setUserName(String userName) {this.userName userName;} }二、通过javap -verbose TulingByteCode .class反编译 //…
阅读更多...
RobotFramework 自动化测试实战进阶篇

RobotFramework 自动化测试实战进阶篇

工具 Robotframework, 采用PO设计模式 PO模型 PO模型即Page Objects，直译意思就是“页面对象”，通俗的讲就是把一个页面，或者说把一个页面的某个区域当做一个对象，通过封装这个对象可以实现调用。 PO设计的好处 代码复用&…
阅读更多...
python实现简单选择排序法

python实现简单选择排序法

对于排序的方法中，简单选择排序法是相对符合人类的思维的一种方式，对于简单选择排序方法的核心思想是： 从待排序的序列集合中，找到最大值或者是最小值，然后将该值放置在其在最终的排序序列中的位置，也就是…
阅读更多...
4.2 克隆

4.2 克隆

一，什么是克隆？ 克隆是指通过共享缓冲区来复制内容（例如，两个窗口共享相同的内容）。 克隆可用于提高性能： 可以减少所需的更新次数。 你可以在多个显示器上显示内容，但只需要更新一个缓冲区…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023