电商后台管理系统技术总结(黑马)[通俗易懂]

电商后台管理系统技术总结(黑马)[通俗易懂]一. 项目介绍此项目主要是一个电商的后台管理系统,主要是由六个大的模块组成分别为开发过程中使用Vuecil4脚手架进行开发,然后主要通过elementUI美化项目结构,使用码云作为Git管理仓库,对应的API文档,采用express搭建的API服务,返回的数据是JSON格式的数据二.项目依赖Vue+VueRouter+Element-UI和Axios以及Echarts:三.各页面总结1.登录和退出(axios引入、拦截器、导航守卫)登录:获取用户表单信息,主要使

大家好,又见面了,我是你们的朋友全栈君。

一. 项目介绍

此项目主要是一个电商的后台管理系统,主要是由六个大的模块组成分别为
在这里插入图片描述

开发过程中使用 Vue cil4 脚手架进行开发,然后主要通过 elementUI 美化项目结构,使用码云作为 Git 管理仓库,对应的 API 文档,采用 express 搭建的 API 服务,返回的数据是 JSON 格式的数据

二.项目依赖

Vue+VueRouter+Element-UI和Axios以及Echarts:

三.各页面总结

1.登录和退出(axios引入、拦截器、导航守卫)

登录:获取用户表单信息,主要使用了element的input验证和axios请求来完成登录项目,提交后给后端接口验证,如果匹配则返回一个token,使用cookie存储,再根据token去拉取用户信息接口获取信息,登录成功后,跳转至主页面。当请求登录时,验证数据正确的话,服务器会返回一个token给登陆页,需要把他放到请求头里,在每次请求时里面都带着token
axios引入:通过
具体代码如下:
在这里插入图片描述

axios拦截器:这里使用request拦截器是为了在每个请求头塞入token,好让后端对请求进行权限验证,response拦截器。
具体代码如下:
在这里插入图片描述

导航守卫:有组件需要登录才能展示,这个练习项目中,是先登录才能展示其他页面,不登录无法展示页面,所以有一个全局的导航守卫。这里注册一个全局前置守卫,当一个导航触发时,全局前置守卫按照创建顺序调用。
具体代码如下:
在这里插入图片描述

2.Home页面

1…动态侧边栏和面包屑(this.$router.options.routes,meta路由元的使用)

、、后续慢慢更新啦

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/140884.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • java中输出流OutputStream 类应用实例(转)

    java中输出流OutputStream 类应用实例(转)

    2021年9月2日
    79
  • 虚拟ip的概念_虚拟化的概念

    虚拟ip的概念_虚拟化的概念1.虚拟IP是什么?要是单讲解虚拟IP,理解起来很困难,所以干脆把动态IP、固定IP、实体IP与虚拟IP都讲解一下,加深理解和知识扩展实体IP:在网络的世界里,为了要辨识每一部计算机的位置,因此有了计算机IP位址的定义。一个IP就好似一个门牌!例如,你要去微软的网站的话,就要去『207.46.197.101』这个IP位置!这些可以直接在网际网络上沟…

    2022年10月20日
    3
  • 【系统架构设计师】第一章:操作系统(1.2.2) 信号量与pv操作

    【系统架构设计师】第一章:操作系统(1.2.2) 信号量与pv操作本篇帖子继续上篇。有兴趣可以点击链接进行查看以前写过的文章。【系统架构设计师】第一章:操作系统(1.2.2)参考教材:《系统架构设计师考试全程指导(第二版)》《系统架构设计师教程》1.2.2信号量与pv操作pv操作指的是两个:p操作和v操作。有时候我们的进程在工作的时候,需要同时配合来干多件事情。比如,我们规定一个进程用来写入数据,另一个进程用来读取数据。很显然,这连个进程是不能互相干扰的…

    2022年7月15日
    22
  • ETL的开发过程[通俗易懂]

    ETL的开发过程[通俗易懂]在生产环境中,使用shell脚本完成一次etl操作1.定义一个etl函数,里面传入json行数据,用json.loads加载行数据,并对行数据进行判断,如果没有行数据,或data字段没有在行数据里,就直接返回空的结果,否则就继续往下执行2.接着获取行里的数据,用for循环判断,如果包含某个值,我就将变量赋值取出,装在集合容器里3.设置sparksession会话,并ena…

    2022年5月23日
    35
  • acwing-167. 木棒(深搜dfs+减枝)「建议收藏」

    acwing-167. 木棒(深搜dfs+减枝)「建议收藏」乔治拿来一组等长的木棒,将它们随机地砍断,使得每一节木棍的长度都不超过 50 个长度单位。然后他又想把这些木棍恢复到为裁截前的状态,但忘记了初始时有多少木棒以及木棒的初始长度。请你设计一个程序,帮助乔治计算木棒的可能最小长度。每一节木棍的长度都用大于零的整数表示。输入格式输入包含多组数据,每组数据包括两行。第一行是一个不超过 64 的整数,表示砍断之后共有多少节木棍。第二行是截断以后,所得到的各节木棍的长度。在最后一组数据之后,是一个零。输出格式为每组数据,分别输出原始木棒的可能最小长度

    2022年8月9日
    7
  • Druid 介绍及配置「建议收藏」

    Druid 介绍及配置「建议收藏」 转自阿里Druid官方,欢迎大家使用Druid,常见问题在这里解答,希望对大家有所帮助。1.Druid是什么?Druid是Java语言中最好的数据库连接池。Druid能够提供强大的监控和扩展功能。2.在哪里下载druid正式版本下载: maven中央仓库: http://central.maven.org/maven2/com/alibaba/druid/ 3.怎么获…

    2022年7月23日
    13

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号