摘要: vue项目里导出word模板,导出Excel表格~预览PDF附件内容的📈📑 第一:导出Word模板 一、安装依赖包 1、docxtemplater npm install docxtemplater pizzip -S2、jszip-utils npm install jszip-utils -S3、pizzip npm install pizzip -S4、FileSav 阅读全文
posted @ 2024-01-09 16:02 Mahmud(مەھمۇد) 阅读(66) 评论(0) 推荐(0) 编辑
摘要: 上传图片【选择文件&#128193;+上传图片&#127912;】 1. 上传图片的流程分析:【选择文件📁+上传图片🎨】 2.1 功能步骤 2.1 页面基本布局 基本布局 <template> <el-card class="box-card"> <div slot="header" class="clearfix"> <span>更换头像</span> </d 阅读全文
posted @ 2023-09-04 12:01 Mahmud(مەھمۇد) 阅读(144) 评论(0) 推荐(0) 编辑
摘要: localstorage本地存储token,vuex刷新数据丢失问题⚡⚡⚡ 1.vuex和axios安装,引入,使用 1.1vuexa安装和使用 vuex3.x版本的官网安装教程:安装 | Vuex vuex4.x版本的官网安装教程:安装 | Vuex npm install vuex --save 2.在src下新建文件夹store,并在文件夹中新建文件index.js, 阅读全文
posted @ 2023-08-25 08:53 Mahmud(مەھمۇد) 阅读(267) 评论(0) 推荐(0) 编辑
摘要: elementui表格中实现点击单个单元格和表头--带参数触发事件/跳转路由 对于element表格做点击跳转的功能有两大类:1,表头的点击跳转2,表格内容单元格进行点击跳转 是因为该表格只有tabs标签也第二个选项被选中的时候才能让他起效果,所以先做判断,第二个tabs标签被选中的时候实现该功能 1,tabs标签做判断 this.saveTableName1是第二个tabs 阅读全文
posted @ 2023-01-10 13:51 Mahmud(مەھمۇد) 阅读(2615) 评论(0) 推荐(0) 编辑
摘要: ElementUI实现图片上传的功能&#127752;~(已完成✔) Vue项目中经常会遇到使用ElementUI实现图片上传的需求~(已完成✔) (1)安装官网组件Upload 打开官网有个Upload 上传组件-通过点击或者拖拽上传文件:本次项目中用到了:图片列表缩略图结构 <!-- action-表示图片要上传到的后台api地址--> <!-- on-previ 阅读全文
posted @ 2022-11-27 23:17 Mahmud(مەھمۇد) 阅读(1529) 评论(1) 推荐(0) 编辑
摘要: Vue项目中使用ElementUI实现Steps步骤条和Tabs标签页的联动效果功能 Vue项目中使用Elemen-tUI做一个steps步骤条:左边的内容和步骤条进度效果是同步的切换,顶部是 (1)steps步骤条 (2)Tabs标签页 (3)steps步骤条和tabs标签页之间的联动效果 思路: 那么这里需要步骤条的属性名称和标签页的属性名称联动同步切换的功能:步骤条是属性 :a 阅读全文
posted @ 2022-11-27 14:30 Mahmud(مەھمۇد) 阅读(2455) 评论(0) 推荐(0) 编辑
摘要: 项目实现用户长时间不操作,自动退出登录⏳ Vue项目实现用户长时间不操作,自动退出登录 1.实现思路 使用 mouseover事件来监测是否有用户操作页面,然后写一个定时器间隔特定时间检测是否长时间未操作页面,如果是清除token,提示登录已过期请重新登录 每隔10s去检查一下用户是否过了10秒 未操作页面因为我这边是单点登录所以用户10秒 阅读全文
posted @ 2022-11-12 15:06 Mahmud(مەھمۇد) 阅读(507) 评论(0) 推荐(0) 编辑
摘要: vue项目中手机号+邮箱验证正则~✔ vue项目中手机号+邮箱验证正则~✔ vue项目中经常会遇到各种验证规则的需求。这里我把布局用ElementUI来写出来了。接下来需要添加用户,密码,手机号,邮箱的验证规则。 里面用户名,密码是比较简单的,直接用element提供的组件验证规则。手机号和邮箱是自定义规则,需要严格验证是否合法 1,首 阅读全文
posted @ 2022-11-09 20:22 Mahmud(مەھمۇد) 阅读(593) 评论(0) 推荐(0) 编辑
摘要: ElementUI的左侧菜单栏的小问题~~ Vue后台管理的项目中使用了ElementUI的组件库。左侧菜单栏遇到了一些小问题,结果一步一步的解决了~~ 1,首先菜单栏的图标Icon不满足我们的需求,我们可以引入公司内部的样式icon图标文件,数组的方式动态渲染出来就可以。 2,左侧菜单栏的列表渲染完成后点击一个菜单发现全部菜单同时展开 3, 阅读全文
posted @ 2022-11-07 09:13 Mahmud(مەھمۇد) 阅读(760) 评论(0) 推荐(0) 编辑
摘要: 登录与退出功能-保存token和设置token过期时间过期重新到登录页面 Vue项目登录与退出功能-保存token和页面权限控制,设置token过期时间过期重新到登录页面,本地保存有token就直接不用输入账号密码跳转到首页 做vue后台管理系统的项目的过程中有个登录退出的业务逻辑: (1)发起登录请求之前做个对账号密码表单的合法性进行验证规则 (2)登录的时候发起请求获 阅读全文
posted @ 2022-10-27 17:36 Mahmud(مەھمۇد) 阅读(1526) 评论(3) 推荐(0) 编辑
摘要: vue项目启动cannot get,并且还有报错信息.. 项目中需要下载第三方 :树形表格组件vue-table-with-tree-grid 结构 通过npm下载vue-table-with-tree-grid失败 ,直接先下载yarn--再下载vue-table-with组件 结果项目报错,不能正常运行。一直报错... 卸载了yarn版本还是报错,we 阅读全文
posted @ 2022-10-11 13:30 Mahmud(مەھمۇد) 阅读(579) 评论(0) 推荐(0) 编辑
摘要: vue 图片转base64格式方法+将base64流数据转成pdf文件可打印的方法✔️✔️✔️ 1. 图片转base64格式方法 (主要的代码)(其实用的还是FileReader) handleRemove(file, fileList) { console.log(file); var reader = new FileReader(); reader.readAsDataURL(file. 阅读全文
posted @ 2023-10-31 16:12 Mahmud(مەھمۇد) 阅读(688) 评论(0) 推荐(0) 编辑
摘要: Vue中使用vue-count-to(数字滚动插件) 效果图 1. 简单介绍 npm官网:vue-count-to vue-count-to 就是一个组件插件,咱们引入进来,可以去打印一下,它就是一个组件实例,使用components注册一下,就可以在模板中使用了,具体方式如下: 2. 安装 npm install vue-count-to 3. 引入 阅读全文
posted @ 2023-10-24 15:41 Mahmud(مەھمۇد) 阅读(264) 评论(0) 推荐(0) 编辑
摘要: js对象里面添加对象+数组的方法操作~笔记&#128221; 1. js对象里面添加对象 在js对象里面添加对象有三种方式:直接添加,Object.assign() ,展开运算符(...) (1)直接添加: let obj = { name: 'Tom' }; obj.age = 8 console.log(obj); //输出结果为{ name: 'Tom' 阅读全文
posted @ 2023-10-16 16:19 Mahmud(مەھمۇد) 阅读(959) 评论(0) 推荐(0) 编辑
摘要: Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法~ 前几天在vue运行项目过程中报错了,这个方法是 关于Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法 (1)报错一 (2)报错二~ 1.1问题分析 首先,检查代码,并没有什么错误的地方;其次,涉及到这个问题,可能就 阅读全文
posted @ 2023-10-12 17:15 Mahmud(مەھمۇد) 阅读(390) 评论(0) 推荐(0) 编辑
摘要: 用户登录&#128274;~生成图片验证码(identify(生成图片验证码)插件) 1.效果图: 2.以用户登录实现 生成图片验证功能:使用 identify(生成图片验证码)插件 identify:这是一个vue的插件,使用canvas来生成图形验证码 2.1 下载identify插件,npm安装 npm i identify 2.2 具体参数如下: 2.2 在component 阅读全文
posted @ 2023-09-23 19:34 Mahmud(مەھمۇد) 阅读(129) 评论(0) 推荐(0) 编辑
摘要: js简单的倒计时器~~⏰ 1.效果图 2.html部分 3.逻辑部分 3.1获取当前时间,时间差 //获取当前时间 var date = new Date(); var now = date.getTime(); //设置截止时间 var str = "2023/9/14 12:28:34"; var endDate = n 阅读全文
posted @ 2023-09-14 12:40 Mahmud(مەھمۇد) 阅读(33) 评论(0) 推荐(0) 编辑
摘要: 实现:修改密码&#128273;~确认新密码&#128274;~重置密码&#128279;~提交操作✔ 1. 功能效果图: 2. 基本布局 先需要引入elementUI插件- 注册 基本布局code <template> <el-card class="box-card"> <div slot="header" class="clearfix"> <span>重置密码</span> </div> <! 阅读全文
posted @ 2023-09-06 10:36 Mahmud(مەھمۇد) 阅读(112) 评论(0) 推荐(0) 编辑