- 博客(40)
- 收藏
- 关注
RSS订阅原创 Vue3组合式API之getCurrentInstance详解（在行为验证码之滑动验证AJ-Captcha遇到在开发环境可以，测试环境报错）
ctx和proxy都是getCurrentInstance()对象中的属性，通过解构赋值的方式拿到。但是在Vue3中，在setup中无法通过this获取组件实例的。所以在Vue3中，我们可以通过getCurrentInstance()来获取当前组件实例。首先大家知道我们可以通过 getCurrentInstance这个函数来获取当前组件的实例对象,也就是当前vue这个实例对象。由于本人在使用AJ-Captcha插件的过程中发现在开发环境调试正常，但是测试环境会报错，获取不到组件实例。开发中只适用于调试！
2023-11-01 13:12:18
2077
原创 vue el-table指定合计行不参与排序
我的最尾部的合计行是单独请求接口的数据放在了列表的最后一行的。但是我对列表排序的时候并不想带上最后一行合计行，
2023-05-16 16:00:17
903
原创 element中table设置多级表头并固定制定列，解决固定列不显示内容
需注意给多级表头和需要固定的列每一列都加上fixed属性，并且子表头列的宽度设置总和需要大于等于父级表头，既可以解决。
2023-04-23 16:43:43
4481
1
原创 用npm run ser启动项目或者npm run build打包会报emittingFATAL ERROR: Ineffective mark-compacts near heap limit
在项目中运行 increase-memory-limit ，内存扩展完成，再启动项目就可以了。原因是：项目大，启动或打包会抛出内存溢出，需要扩展node服务器内存。，再次重新启动项目，即可成功！
2023-03-15 19:54:58
360
原创 设置文本内容超过三行...展示，并且显示展开按钮，点击展开可对文章进行展开收起操作
设置文本内容超过三行...展示，并且显示展开按钮，点击展开可对文章进行展开收起操作
2022-08-18 10:23:55
3942
原创 vue，js中json对象数组按对象属性排序（sort方法）根据英文首字母进行排序
vue，js中json对象数组按对象属性排序（sort方法）根据英文首字母进行排序
2022-08-16 19:56:36
1430
原创 vue+element,上传图片组件，设置允许上传图片的类型引起的相关问题，及解决办法
vue+element,上传图片组件，设置允许上传图片的类型引起的相关问题，及解决办法
2022-07-29 17:58:58
1510
原创 vue+element--- el-input 限制只能输入数字时与表单验证rules冲突问题
vue+element— el-input 限制只能输入数字时与表单验证rules冲突问题el-input 限制只能输入数字时οninput="value=value.replace(/^\.+|[^\d.]/g,'')问题: 当输入其他字符再输入数字的时候，输入框中显示有值，就会与表单验证 rules冲突.实际去打印 v-model绑定的变量时获取不到新输入值。表单验证信息会一直存在.解决方法加入事件: @blur=“salaryChange”<el-form :model
2022-04-28 16:40:10
1393
2
原创 vue中ts无法识别引入的vue文件，语法提示找不到xxx.vue 模块，解决办法
在ts文件中引入后缀为vue的文件，给出下列报错提示，看着属实很烦，之前在官方文档中是需要把下面这行代码写到shims-vue.d.ts文件中，但是目前在本项目中还是会出现上述的报错提示。解决办法：shims-vue.d.ts中的下面这段代码要删掉，在src根目录下，新建一个xxx.d.ts文件，把下面这段代码放入即可解决报错问题，完美～～declare module "*.vue" { import Vue from 'vue' export default Vue}..
2022-03-03 17:19:01
3784
原创 jquery-设置单选框的选中状态和清除选中状态
//设置单选框的选中属性 $(this).prop("checked", true); //取消单选框的选中 $(this).prop("checked", false);
2022-01-06 16:14:37
2789
原创 element。input只能输入数字
onkeyup="this.value=this.value.replace(/[^\d.]/g,'')"
2022-01-06 16:10:52
373
原创 element表格固定表头每列宽度，最右侧固定后，溢出出现滚动条内容和表头不能同时移动
当最右侧固定，前面因为设置了固定宽度，所以宽度不够就会出现滚动条，但是我们发现，出现滚动条的时候，只是内容向右滑动了，表头固定没有变，被固定最右侧的订单号列遮挡此时发现因为设置了 overflow: visible；（内容不会被剪切，内容会溢出显示在元素框之外）添加属性 overflow: initial（默认溢出）只要添加下面一行，即可解决， .el-table__header-wrapper { overflow: initial; }...
2021-09-29 14:44:36
1518
原创 vue --只能输入到小数点后面两位，并且只能输入数字
只能输入小数点后面两位，超出不允许输入 <el-input v-model="data.special_price" placeholder="请输入券面值金额" @keyup.native="data.special_price =oninput(data.special_price) ">//针对券面值input小数点的限制（只能输入小数点后面两位） oninput(num: any) { let str = num;
2021-09-22 16:16:16
703
1
原创 vue+element单位换算，分换算为元
有时候我们开发的时候，关联到价钱的数值，我们后端统一返回分为单位的数据。我们需要自己转换下 //分转换成元 conversion = (num: number) => { const str = num / 100 + ""; const intSum = str .substring(0, str.indexOf(".")) .replace(/\B(?=(?:\d{3})+$)/g, ","); //取到整数部分 const dot = str
2021-09-22 16:13:18
1634
原创 element上传图片，限制图片宽高
上传图片的时候，如果需要显示图片的宽高可以下列代码实现运用上传图片前 的事件，本代码实现的时候宽高为104px的才可以上传，可根据需要自行修改 beforeAvatarUpload(file: any) { // 文件大小限制为100k; const isLt = file.size / 1024 < 100; if (!isLt) { this.$message.error("超出文件限制大小"); } // 文件尺寸限制为104px*104p
2021-09-22 16:09:52
1594
2
原创 git merge分支合并push之后如何回滚到merge前的版本
git merge分支合并push之后如何回滚到merge前的版本git reset --hard HEAD^git push -f
2021-09-17 09:42:13
904
原创 foreach循环，return无效
当你需要用循环数组中的某个值来当判断条件，进行判断时，不满足判断条件，进行跳出循环操作 this.tableData.forEach((val: any) => { console.log(val.original_price); console.log(this.data.special_price); val.original_price = val.original_price / 100; if ( val.original_p
2021-09-17 09:29:38
1470
原创 element input只能输入不为0 的数字
<el-input v-model="data.release_count" placeholder="请输入发放总量" @input=" data.release_count = String(data.release_count) .replace(/[^\d]/g, '') ..
2021-09-15 10:10:29
869
原创 element+vue时间戳和日期格式进行转换
安装插件npm install moment 或者 yarn add moment引入import moment from 'moment'; 时间戳转换成日期格式//time为要转换的时间 moment(time).format("YYYY-MM-DD");日期格式转换为时间戳moment(time).unix() * 1000,
2021-09-14 13:24:05
467
原创 vue+element+typescript手动添加表格数据进行单条删除，当页无数据时，跳转上一页
在删除事件内添加下面逻辑即可 //删除当页最后一条数据的时候自动跳转到上一页 // this.tableData.length 当前表格的总条数 const totalPage = Math.ceil(this.tableData.length /this.pagesize); // 总页数 console.log(totalPage); this.currentPage = this.currentPage > totalPa
2021-09-14 13:19:18
257
原创 vue+element列表前端进行手动分页
**element表格手动分页，vue+element+TypeScript **在表格控件添加属性：:data=" tableData.slice((currentPage - 1) * pagesize,currentPage * pagesize ) " <el-table class="table" :data=" tableData.slice( (currentPage -
2021-09-14 13:16:33
350
原创 git tag使用方法，针对tag创建，查看，回退，删除等功能的命令实现
vscode中的git的tag功能的使用创建tag使用终端命令方法：git tag -a V1.0 -m 'release 1.0上面的命令我们成功创建了本地一个版本 V1.0 ,并且添加了附注信息 ‘release 1.1’也可以使用vscode中 git插件的方法进行创建点击图中+，按要求填写tag名字和备注说明的信息，进行本地添加。查看taggit tag要显示备注信息,用 show 指令来查看git show V1.0同步到远程代码库git push orig
2021-09-06 15:28:29
1610
原创 vue +element 限制input中只能输入数字
input中只能输入数字 <el-form-item label="盒内数量" prop="pill_amount" style="width: 320px"> <el-input placeholder="请输入" @input="data.pill_amount = String(data.pill_amount).replace(
2021-08-31 16:09:21
436
原创 vue+element+ts。 提交校验多个表单
vue+element，提交校验多个表单点击按钮进行表单提交，同时校验 多个表单. （运用的ts开发）代码如下：//表单一 <el-form class="form-box" ref="ruleForm" :rules="rules" :model="data" label-position="top" label-width="180px" :inli
2021-08-30 17:39:56
1132
原创 使用vuedraggable插件的时候，动态新增表格行的同时，获取焦点会出现滚动条以及内容的抖动bug
使用vuedraggable插件的时候，动态新增表格行的同时，获取焦点会出现滚动条以及内容的抖动bug抖动效果：var e = evt || window.event; var chosen = document.querySelector('.sortable-fallback'); chosen.style.top = e.item.offsetTop + 'px';...
2021-05-12 17:19:52
1156
原创 element-ui+vue实现表格动态添加表格行，并且可以进行上下移动
element-ui+vue实现表格动态添加表格行，并且可以进行上下移动由于项目需求，我所实现的是表格可以添加多个，并且每一个表格内的表格行也可以进行动态添加下面是代码的实现html代码部分： <draggable v-model="formInline.addFormArr" chosenClass="chosen" forceFallback="true" group=
2021-05-07 14:59:26
4941
转载 elementUI中select下拉框设置了多选multiple之后 一进页面就触发校验bug
elementUI中select下拉框设置了多选multiple之后 一进页面就触发校验bug问题描述 : 在elementUI中 , Form表单设置了rules校验规则 , 正常情况下 , 进页面是不会触发校验规则的 , 但是select下拉框设置了multiple 多选属性之后 , 就会产生bug . 原因是select下拉框设置多选属性之后 , 进页面就会触发change事件导致触发校验规则 , 如图作者：FunnySoul300Jin链接：https://www.jianshu.com
2021-04-06 17:47:31
2579
原创 vue+element-ui点击表格中的编辑选项，实现文件回显
vue+element-ui点击表格中的编辑选项，实现文件回显如图：实现对文件的回显关键代码：:file-list="fileList1"，<el-upload class="upload-demo" ref="upload1" :action="baseUrl+'/module/v1/manage/'" :data="{optype:'1',product
2021-04-06 16:15:39
2538
原创 vue+elementui 上传文件时限制上传文件的类型和大小
vue+elementui 上传文件时限制上传文件的类型和大小重点属性–:before-upload="beforeAvatarUpload"html代码：<el-upload class="upload-demo" ref="upload1" :action="baseUrl+'/module/v1/manage/'" :data="{optype:'
2021-04-06 15:43:31
2715
原创 vue+element-ui 实现提交form表单上传文件
实现提交form表单上传文件，在开发中有时候设计到上传文件，想实现的需求不是上传文件并携带 参数，是想要提交表单的同时，携带上传的文件。那么 我们就需要用这种方法来实现 <el-form-item label="测试依赖excel文件:" label-width="150px"> <el-upload class="upload-demo" ref=
2021-04-06 15:40:02
4116
2
原创 vue+element-ui表格中实现树状表格。并且插入下拉框项
vue+element-ui表格中实现树状表格可以进行多选。并且插入下拉框项在开发中遇到一个需求是表格中的数据要以复选框树状的形式来展示，并且表格的某一列表头嵌套下拉框，下拉框中可以任意选数据，点击多选框进行多选保存如图每一行数据可以进行对版本的一个下拉选择，并且进行勾选保存，html代码如下：（小菜鸡一枚，大家多多指教！欢迎大家指出问题~~~~） <el-table ref="table" :data="tableData"
2021-04-06 15:25:02
3504
原创 vue基于element-ui input为密码框时进行密码隐藏与显示，并且不自动进行回显
vue基于element-ui input为密码框时进行密码隐藏与显示，并且不自动进行回显只需在代码中添加 show-password 和 auto-complete="new-password"两个属性即可实现，代码如下： <el-form-item label="用户密码:" prop="passwd" :label-width="formLabelWidth">
2021-04-06 15:10:34
2764
2
原创 vue中element-ui实现表单根据不同下拉框进行动态表单校验
vue中element-ui实现表单根据不同下拉框进行动态表单校验我们想实现的功能如下，请看效果：话不多说我们上代码html部分： <el-form :model="formInline" ref="formInline" :inline="true" :rules="rules" style="width: 600px;">
2021-04-01 16:27:36
2990
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人