Ant Design Vue Pro流程分析记录

news2024/11/19 1:36:10

一、基本介绍

        Ant Design Vue Pro提供了一套完整的解决方案,包括路由、状态管理、UI组件库、HTTP请求封装等,方便开发者快速搭建和维护企业级应用。

二、官网地址

      Ant Design Pro of Vue

三、下载及安装

        推荐使用Yarn

 四、文件分布及说明

dist:发布时产生文件的目录

node_modules:官方和第三方组件所在目录(一般无需修改,如有修改需要注意会被覆盖)

public:公共资源目录

scr:主要代码目录

        api:走向后端的路由目录,其中login.js是登录相关,manage.js是基本管理相关;

        components:组件目录,自定义组件可放到此目录;

        config:配置文件,其中defaultSetting.js项目基本配置,譬如项目名称;

                                     router.config.js登录后主界面静态展示的菜单及路径;

         mock:静态资源,不连后端时常用;

         router:路由,动态生成界面展示路由;

         store:类似于控制器,即主体逻辑在此目录下实现,譬如动态路由的调用,登录接口的调用及逻辑处理;

         utils:工具包

         views:视图,界面展示代码

         tests:测试目录

package.json:组件及其版本等文件,其中:

调试下面部分影响了后续运行使用的命令,譬如,运行时使用yarn run serve中的serve指的就是这里的serve.

五、运行机制:

  1. 用户访问应用时,路由将用户导向BasicLayout

  2. BasicLayout渲染顶部导航栏和侧边栏。

  3. 根据用户的路由地址,Vue Router加载对应的页面组件。

  4. 页面组件可能会通过Vuex进行状态管理,也可能会通过Axios进行HTTP请求。

  5. 页面加载相关资源和数据,并渲染到页面上。

六、登录流程

src.views.user.Login.Vue页面,输入用户名密码后,点击登录,响应handleSubmit事件;

事件中调用Login方法,跳转到src.store.modules.user.js中的Login;

在Login方法中调用login,跳转到scr.api.login.js中的login,进而调用后端方法

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

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

相关文章

文件上传巩固及流量分析

1.[GXYCTF2019]BabyUpload 1)打开题目也是没有任何提示, 2)进入环境,看到下面页面猜测是文件上传漏洞,下面开始传文件 3)首先上传一句话木马 a.php,代码如下: 下面这个代码中并没有…

pinia持久化未生效

pinia官方文档 https://prazdevs.github.io/pinia-plugin-persistedstate/zh/guide/ pinia持久化未生效的原因很有可能就是在main.js中重复创建了pinia,导致持久化未生效

基于jeecgboot-vue3的Flowable增加表单功能(一)

因为这个项目license问题无法开源,更多技术支持与服务请加入我的知识星球。 1、通过online表单设计进行,生成代码 主要注意2点,1个是查询需要选择哪些字段,同时创建人员需要选择用户选择 这里,SysForm增加下面的一个注…

反射、类加载、静态代理,jdk动态代理,cglib代理

一、 反射 反射是在程序运行状态下,动态获取类的结构(属性,构造器,方法,注解),动态的创建类对象然后调用类中的属性方法。反射的起源Class,Class中包含类反射要使用的API 获取Class的…

AI 前沿发展摘要

🔔 AI 前沿发展摘要 1⃣️ ChatScene: 一句话生成自动驾驶关键场景 主要功能: Chat Scene 能够在CARLA仿真环境中创建多样化和复杂的场景, 有效地弥合了交通场景文本描述和CARLA实际仿真之间的鸿沟 效果: 通过使用生成的安全关键场景来微调不同的基于RL的自动驾…

艾体宝干货 | 教程:使用ntopng和nProbe监控网络流量

本教程旨在分享如何通过 ntopng 和 nProbe 这两款工具,深入了解和掌握网络流量监控的艺术。我们将提供从基本概念到高级应用的全面指导,涵盖了在多种平台和设备上的部署和配置步骤。不论您是专业人员还是技术爱好者,跟随本教程,都…

『香橙派』基于Orange Pi AIpro打造高效个人云存储解决方案

📣读完这篇文章里你能收获到 了解Orange Pi AIpro硬件优势,为构建高效云存储基础设施的理想平台。学会使用Orange Pi AIpro硬件平台,搭载Ubuntu Server系统,打造云存储环境。掌握利用Kodbox软件,享受文件管理、多格式…

如何将 Langfuse 链接到自有 PostgreSQL 数据库并升级 PostgreSQL 版本

在本文中,我们将介绍如何将 Langfuse 应用程序链接到自有的 PostgreSQL 数据库,并升级 PostgreSQL 以支持 jsonb 类型。 前提条件 运行 CentOS 7 的服务器已安装的 PostgreSQL 9.2 或更低版本需要将 Langfuse 连接到自有数据库,并升级 PostgreSQL 以支持 jsonb 类型1. 将 La…

迅为RK3562开发板专为3562编写10大分类2900+页文档

iTOP-3562开发板采用瑞芯微RK3562处理器,内部集成了四核A53Mali G52架构,主频2GHZ,内置1TOPSNPU算力,RK809动态调频。支持OpenGLES1.1/2.0/3.2、0penCL2.0、Vulkan 1.1内嵌高性能2D加速硬件。 内置独立NPU, 算力达 1TOPS,可用于轻…

2024中青杯数学建模竞赛B题药物属性预测思路代码论文分享

2024年中青杯数学建模竞赛B题论文和代码已完成,代码为B题全部问题的代码,论文包括摘要、问题重述、问题分析、模型假设、符号说明、模型的建立和求解(问题1模型的建立和求解、问题2模型的建立和求解、问题3模型的建立和求解)、模型…

设计模式:外观模式 导诊台。空指针异常

文章目录 UML类图目录结构思路Register.javaOutpatientService.javaPrice.javaPharmacy.javaFacade.java空指针异常 Test.java UML类图 目录结构 思路 照着写,然后getRegister()方法的具体实现就是:打印一句话,然后到…

Java集合面试题集——2024最新大厂面试

文章目录 1. 集合框架2. ArrayList和LinkedList2.1 源码分析2.2 ArrayList listnew ArrayList(10)中的list扩容几次?2.3 如何实现数组和List之间的转换2.4 ArrayList和LinkedList的区别2.5 如何保证ArrayList的线程安全?2.6 CopyOnWriteArrayList是如何实现线程安全…

优选免单:重塑电商销售模式的新策略

随着电商行业的不断发展,一种名为“优选免单”的新兴销售模式正逐渐崭露头角。该模式以独特的价格策略、创新的奖励机制和巧妙的社交网络应用为核心,成功激发了消费者的购买热情,并实现了销售的高速增长。 一、规范运营,避免潜在风…

STL源码刨析:序列式容器之list

目录 1.前言 2.list的节点定义和结构 3.list的迭代器定义和结构 4.list的定义和结构 5.list的内存管理 6.list的元素操作 前言 在刨析了vector容器的源码后,list容器相比与vector容器,其元素的插入和删除较快,不需要对原本容器中的元…

哈希冲突的常见解决方法【附C++代码】

在C中,哈希表是一种常用的数据结构,用于实现快速的插入、删除和查找操作。 哈希表的核心在于哈希函数,它将输入的关键字转换为一个数组索引。然而,不同的关键字可能映射到相同的索引,这种情况称为哈希冲突。 有效地解…

【MIT 6.5840(6.824)学习笔记】GFS

1 分布式存储系统难点 在设计大型分布式系统或存储系统时,初衷通常是为了获得显著的性能提升,通过数百台计算机的资源来并行完成大量工作。因此,性能问题成为最初的关注点。一个自然的想法是将数据分片(Sharding)&…

GPT-4 与 GPT-4 Turbo有什么区别?

在不断发展的人工智能和自然语言处理领域,OpenAI 的 GPT 系列一直走在最前沿,彻底改变了机器理解和生成类人文本的方式。每一次迭代,进步都会突破可能性的界限。 最新的条目 GPT-4 和 GPT-4 Turbo 引起了人工智能社区内外的极大兴趣和争论。…

保留字与标识符

目录 保留字 标识符 自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 保留字 保留字是Python语言中一些已经被赋予特定意义的单词。开发程序时,不可以把这些保留字作为变量、函数、类、…

河道流量监测解决方案 河道水位监测 水质在线监测-计讯物联科技

在城市河道与入海口间的通道施工项目中,拦水坝不仅承担着调节水流、保护生态平衡的使命,也是确保施工区域安全的关键屏障。当前,项目团队面临着严峻的挑战:水位的异常上升和流量的急剧变化,这些都可能对拦水坝的稳定性…

公司预防文件泄密的常见手段 | 文件防泄密软件推荐排行榜

在当今信息化社会,企业面临着越来越多的文件泄密风险。为了保护企业的核心信息和资产,公司需要采取一系列手段来预防文件泄密。本文将介绍公司预防文件泄密的常见手段,并推荐五款优秀的防泄密软件,帮助企业构建更为严密的数据安全…