
Vue3全家桶
文章平均质量分 92
基于Vite4+Pinia2+ElementPlus+Router4的Vue3项目。从零开始搭建项目,到每一个工具的详细使用,包括按需引入、国际化、封装axios、动态路由等等全套详解。
Wait.End
热爱前端开发的工程师
展开
-
Vite4+Pinia2+vue-router4+ElmentPlus搭建Vue3项目(组件、图标等按需引入)[保姆级]
Vite4+Pinia2+vue-router4+ElmentPlus搭建Vue3项目(组件、图标等按需引入)[保姆级]。element-plus为UI框架。pinia为状态管理,和vuex一样。vue-router路由。nprogress顶部进度条。animate.css一个跨浏览器的动画库。测试ElementPlus、图标以及vue3API等按需引入情况。修改App.vue文件。原创 2023-01-12 16:13:50 · 8083 阅读 · 1 评论 -
Vite4 + Vue3 + vue-router4 动态路由
动态路由,基本上每一个项目都能接触到这个东西,通俗一点就是我们的菜单是根据后端接口返回的数据进行动态生成的。表面上是对菜单的一个展现处理,其实内部就是对router的一个数据处理。这样就可以根据角色权限或者一些业务上的需求,根据不同属性就行路由的划分。到达不同的页面渲染效果。本文只是讲解菜单的权限控制,不到按钮级别。其实按钮也是差不多的。可以设置一个属性表示菜单,一个属性表示按钮,每一个菜单的叶子节点上都包含根据权限返回的按钮数组。接着可以通过组件的形式去输出相应的按钮就可以。原创 2023-03-12 12:47:29 · 4278 阅读 · 0 评论 -
Vite4 + Vue3 + Pinia2 + ElementPlus 实现国际化包括Element内部组件以及表单校验(超详细)
不要问为啥要使用国际化(vue-i18n),现在很多主流的UI框架,上去你会发现他们的文档都是支持多语言的。那我们在工作中难免会有潜在的客户是来自其他国家的。随着时间的推移可能还会支持更多的语言种类,那程序的设计就很至关重要,不可能说多一个国家的客户,我们就去改一次程序。合理的方案应该是运维或者不懂开发的同事直接通过编辑文件或者数据库数据就能增加一种语言才是最实际的。至于采用存储文件还是数据库。根据自己的需求合理安排就好。程序我已经搭建好了。原创 2023-03-16 23:18:59 · 3038 阅读 · 8 评论 -
Vite + Vue3 封装 Axios 并做防重复提交 同一接口 [请求未返回结果、2秒内禁止重复提交](超详细)
是一个基于Promise的HTTP网络请求库,可以用于浏览器和node.js。在服务端它使用原生node.js http模块, 而在客户端 (浏览端) 则使用XMLHttpRequest。它可以帮助我们更轻松、简单地发出 AJAX 请求。原创 2023-04-01 09:45:00 · 2511 阅读 · 0 评论