后台管理系统
如果决定要走又何必挽留
学习交流群:862404453
展开
-
nginx项目部署+项目优化
在项目做完之后,我们会进行项目的打包和优化处理,通常情况下怎么优化呢?输入这一行命令就可以看到代码体积的大小。如果项目使用了element-ui我们可以使用按需导入进行处理。还可以用CDN引入的方式来缩小文件的体积。CDN引入的方式就是在线引入需要的文件。原创 2024-01-29 22:30:44 · 242 阅读 · 0 评论 -
树形+分页+表格
传入上一层的pid。原创 2024-01-19 19:36:05 · 489 阅读 · 0 评论 -
树形+表单的封装+查重数组
后端传过来的数据,可能是平铺的一个结构:在财务部下面,有财务核算部,薪资管理部,我们需要将平铺的数据通过递归转化成:转换成有children的形式,来渲染到页面上去,在这里用到了作用域插槽,具体怎么使用,可以通过查看文档得知。原创 2024-01-16 15:35:23 · 348 阅读 · 0 评论 -
框架自带sidebar配置
在这个框架里面,需要删除一些东西,在VueRouter里面,创建好两个路由,一个是由导出去的,一个是由export导出去的,有很多人问,为什么要创建两个路由呢?为了后期的权限管理做准备,为什么显示出来的只有一个路由的界面呢?在路由注册的时候,需要将两个数组进行合并注册,可以通过扩展运算符。原创 2024-01-15 17:09:57 · 410 阅读 · 0 评论 -
头像的渲染及表单的验证
调用用户信息接口api,在这个调入的过程中,在那个时机调用比较好呢?可以在页面上调用,但是这不是最优的选择,中间有个拦截的过程,可以在这个过程中,发送请求获得数据,但是不能没跳一个页面都发送一次请求吧,显然这并不是可取的,因此我们可以在加一个if判断,如果请求来的了数据,我们就不再发送请求。原创 2024-01-13 22:07:46 · 390 阅读 · 0 评论 -
permission路由
跳转到一个页面之前 执行的钩子函数A---->B A开始跳转 , 还没有到B。原创 2024-01-12 16:53:53 · 410 阅读 · 0 评论 -
登录模块的实现
默认导入import request from '拦截器文件'定义方法:url:'/api地址'method:请求的方法。原创 2024-01-11 23:02:26 · 561 阅读 · 0 评论 -
环境变量的使用
www.xxx.com做为基地址。原创 2024-01-09 23:23:45 · 565 阅读 · 0 评论 -
scope(三)
1.scoped控制了当前作用域,不被污染2.用组件的时候,通常大盒子包裹着大盒子,并有data属性,外层可以直接修改3.后续没有data属性 通过deep来继承前者的属性。原创 2023-08-15 23:57:39 · 128 阅读 · 0 评论 -
element-ui---头像上传
上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。是否显示已上传文件列表。必选参数,上传的地址。原创 2023-08-10 18:57:08 · 1084 阅读 · 0 评论 -
配置页面的路由
如:/mall /user /page1 /pagetwo。2.redirect 要进行重定向的页面。3.后面的路由配置都是根据 /来进行配置的。3.添加点击事件跳转到相应的路由。1.'/'代表主路由。原创 2023-08-07 16:31:30 · 506 阅读 · 0 评论 -
element-ui分页编辑器的使用
代码:准备好初始数据;当前显示在第一页,每页10条数据。原创 2023-08-03 23:35:42 · 424 阅读 · 0 评论 -
编辑接口和新增接口的分别调用
在开发中,通常一个弹窗被两个接口共用,可以使用定义一个状态,从而实现接口的分调。原创 2023-08-03 22:43:46 · 317 阅读 · 0 评论 -
element-ui中表格插槽语法的使用
直接另起一行,直接默认插槽增加两个按钮,通过slot-scope传入当前行的数据。原创 2023-08-03 21:50:39 · 386 阅读 · 0 评论 -
dialog => :before-close的属性应用
这里有个错误观点,只要点击X号的时候会触发before-close这个属性,并不是检测到弹窗关闭的时候触发这个属性。before-close属性是点击X号之后进行的逻辑处理,并不是检测到弹窗关闭后的逻辑处理。在element-ui里面关闭弹窗的时候before-close会触发。before-close捕捉关闭弹窗的动作,发现控制台并没有什么动作。也就是点击X的时候回触发before-close这个属性,因此我们通常在写代码的时候,写上这一行代码。等到全局验证成功后,等到。原创 2023-08-01 22:40:28 · 1511 阅读 · 0 评论 -
平铺的树形结构--------树形的应用
平铺的树形结构--------树形的应用原创 2022-10-09 14:49:55 · 473 阅读 · 0 评论 -
分页实现的思路
分页数据的处理原创 2022-09-28 17:55:37 · 209 阅读 · 2 评论 -
一个项目的整个流程
后台开发的流程原创 2022-09-27 17:14:43 · 5833 阅读 · 6 评论 -
reseFields还原表单的弊端
reseFields还原表单的弊端原创 2022-09-24 01:48:35 · 168 阅读 · 0 评论 -
树形结构的删除
树形结构的删除原创 2022-09-03 16:36:05 · 508 阅读 · 0 评论 -
基本表单验证流程
表单验证的基本步骤原创 2022-08-03 11:14:57 · 659 阅读 · 0 评论 -
基地址:环境变量
环境变量的处理原创 2022-08-03 10:34:08 · 143 阅读 · 0 评论 -
分页数据的处理
pageSize pageNumber原创 2022-07-18 00:06:58 · 2032 阅读 · 0 评论 -
表格编辑 删除对应不通的弹窗
弹窗的应用原创 2022-07-06 23:31:32 · 98 阅读 · 0 评论 -
单项框 复选框
单项框和复选框原创 2022-07-04 22:08:19 · 76 阅读 · 0 评论 -
el-select,el-option下拉选择框
下拉菜单的使用原创 2022-07-04 17:25:40 · 6619 阅读 · 0 评论 -
树形结构数据的处理
树形结构原创 2022-06-30 22:21:39 · 1083 阅读 · 0 评论 -
v-if取反时打括号的重要性
v-if括号和不括号的区别原创 2022-06-01 01:03:34 · 909 阅读 · 0 评论 -
el-input自定义表单验证
在我们平常做开发中,经常会用到自定义表单验证,今天我们来简单的谈一下如何进行自定义表单验证。一.用法validate(rule,value,callback)=>{rule:是一个对象value:当前表单的值callback:一个回调函数}如果value的长度<3 , 那我通知这个回调函数将参数传递过去callback(new Error('输入的长度小于3')),如果上述的条件都满足,那就验证通过 callback()什么也不用传递。二.验证两次输原创 2022-05-29 15:16:55 · 3163 阅读 · 0 评论 -
formatter过滤枚举数据
一.基本参数row,col,callIndex,index<template> <el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el-table-column prop="name" :formatter="fo原创 2022-05-25 22:02:23 · 205 阅读 · 0 评论 -
Element-ui tab栏的切换
代码:<template> <div class=""> <h3>{{ id }}</h3> <div class="detail"> <el-card> <el-tabs> <el-tab-pane label="登录账户设置"> <el-form ref="form" label-width="80px"原创 2022-05-22 22:26:19 · 4233 阅读 · 0 评论 -
增,删,改,查
一.增步骤:1.定义api2.导入api3.点击新增的时候弹出dialog框4.在全局表单验证通过后(1)调用api接口(2)提示新增成功(3)刷新父级列表的数据(4)重置表单,重置验证规则二.删步骤:1.定义删除的api2.导入api3.在点击的时候弹出$confrim框。4.点击确定的时候调用api5.提示删除成功。6.回到第一页。注意:如果不回到第一页会出现Bug。三.改步骤:1.打开弹窗2.回显数据原创 2022-05-22 22:21:30 · 245 阅读 · 0 评论 -
dialog弹窗的用法
这是Element-ui下的代码:<el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button><el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose"> <span>这是一段信息</span> <原创 2022-05-17 22:12:36 · 2487 阅读 · 0 评论 -
获取父子组件的实例化对象
一.$ref获取子组件的实例化对象代码:App.Vue<template> <div class=""> <One ref="xxx"></One> </div></template><script>import One from "@/components/One.vue";export default { name: "", components: { One,原创 2022-05-16 16:13:55 · 1094 阅读 · 0 评论 -
插槽传递数据
在使用element-ui的时候我们会经常用到插槽。如:一个dialog组件代码:<template> <div class=""> <el-button type="text" @click="dialogVisible = true" >点击打开 Dialog</el-button > <el-dialog title="提示" :visible.sync="d.原创 2022-05-15 23:20:12 · 3403 阅读 · 1 评论 -
后台表单验证 +表格获取当前行的数据
表单验证是我们经常用到的东西,今天来看一下表单验证的实现。<template> <div class=""> <el-form :model="form" :rules="rules" ref="form"> <el-form-item prop="name" label="姓名"> <el-input v-model="form.name"></el-input> </e原创 2022-05-15 11:41:51 · 1046 阅读 · 0 评论 -
Element-ui 分页
代码分析:<template> <div class="setting"> <el-card> <el-tabs> <el-tab-pane label="角色管理"> <el-button type="primary" size="small">+新增角色</el-button> <el-table :data="list">原创 2022-05-13 22:11:37 · 2851 阅读 · 0 评论 -
开发跨域问题的解决
在我们平常请求接口的时候会出现跨域的问题,今天来浅谈一下如何解决跨域的问题。在vue.config.js配置示例:'/abc':代理的基地址target:真实的基地址注意事项: 不做任何处理的情况下两者会进行拼接 。加入pathRewrite:配置项表示不会去进行拼接二 .env.developmentVUE_APP_BASE_API = '/abc'...原创 2022-04-10 14:29:28 · 781 阅读 · 0 评论