我的博客

原创 合并单元格

elementUI合并单元格的方法，先计算好要合并的行数rowspan，return {rowspan，colspan}，其他的单元格return{0,0}合并 相同名称的产品。合并固定的两行单元格。

原创 动态class

class里用‘ [ ] ’包着就会被当做变量解析。选中div就加粗文字且加上背景色。

原创 父组件往子组件之间传参，赋值两次，子组件获取不到数据变化

在父组件中需要调用两个接口，放入一个list，然后传给子组件渲染页面但是在子组件中用深度监听都没有监听到数据变化，控制台输出如下：子组件已经渲染加载，但是父组件中的接口在这之后才查出来。

原创 若依框架，页面设置了keepAlive=true，v-if和v-hasPermi作用在统一个按钮上时v-hasPermi失效

的数据状态改变，由 ==1 变成 ==2 的时候，后面的v-hasPermi判断失效。判断前两行为 true ， 后两行没有在页面渲染元素，所以只校验了前两行的。不会移除元素，只是修改了css的样式为隐藏，这样进入当前列表页就会触发这四行的。当前列表页设置了缓存keepAlive=true，同时，在同一个按钮上使用。方法（v-if和v-show的区别），当后面修改了数据状态，后两行为 true，由于页面设置了缓存，根本没有加载。是因为一开始页面初始化时，

原创 vue前端获取项目下的静态资源文件夹中的文件并下载

前端项目/public/static/image文件夹下。项目中获取这两张图片。

原创 vant表单van-field中用van-stepper的坑

今天用van-field里面包着van-stepper进步器，页面渲染上老是出现奇怪的情况。

原创 Echart 环图无数据时置灰

当数据都是0时，把series里的data=null或者=[ ]版本echarts: “5.3.3”Echart 环pie置灰。

原创 nginx alias 同一端口下配置多个项目，刷新404的问题

nginx配置多个项目，用alias指向项目路径，try_files要加包名，否则刷新404，如果是root指定包的路径 直接 try_files $uri $uri/ /index.html;

转载 windows清理nginx日志

nginx日志文件太大了，容易影响性能，可以直接删除，nginx会自动创建，但是有可能在直接删除的时候删除不了，nginx一运行又重新生成了。Quit 是一个优雅的关闭方式，Nginx在退出前完成已经接受的连接请求。进入nginx所在文件夹下cmd。然后在启动nginx即可。然后在右键删除日志文件。

原创 elementui表格序号自增

elementui表格序号自增

原创 使用elementui组件，iconfont图标

FontClass/Symbol前缀：elementui组件中自带的icon 都是el-icon-开头，避开这个名字就行font Familiy：这个是icon的类名

原创 elementui选择月份范围，限制只能选前后1年范围内

选中2022-2月之后可选范围为2021-2月~2023-2月，其余的月份禁用

原创 javaScripe 用set判重

用set判重

原创 vant动态校验表单和红色星号

待修复时，修复时间不校验已修复时，检验修复时间并显示星号坑：1.上的 :required=“requiredRepairTime"只能动态控制红星，但能动态校验2.:rules=”[ { required: faultForm.repairCompleted==‘1’ }], 写法不起作用也无法动态控制校验，必须用变量控制，并且用this.$nextTick(()=>{})更新视图<van-field required name="repairCompleted" label=

原创 若依Ruoyi前后端分离项目，pdfjs预览pdf，实现$download对象调用

我用的是若依版本v3.8.1（分离版）实现预览pdf，使用$download对象调用先看下若依v3.8.1版代码中$download对象是啥说明文档在这里 http://doc.ruoyi.vip/ruoyi-vue/document/qdsc.html#download%E5%AF%B9%E8%B1%A11.下载pdfjs放到前端项目public文件夹下2.准备好后端接口 查询pdf二进制流3.上代码在/src/plugins/download.js中const baseURL = p

原创 replaceAll和replace区别

把时间的‘-’替换成‘/’let str = '2021-12-28'str.replace('-','/'); //只替换第一个‘-’str.replace(/-/g,'/'); //正则可以替换全部的‘-’str.replaceAll('-','/'); //可以替换全部的‘-’，但是有些版本浏览器不支持，兼容性不是很好...

转载 ios系统 带‘-’的时间转为时间戳 报错Invaild Date

在ios上无法读取new Date(‘2018-08-09 11:59:59’)，但是在Android是可以用的。方法一var endTime = new Date('2018/08/10 11:59:59')alert(endTime.getTime())方法二varendTime = new Date("Jan 1, 1970 00:00:00")console.log(endTime.getTime());方法三var endTime = '2018-08-10 11:59:59'

原创 vantui一个输入框验证两个条件

需求超过字数限制要有明显的提示不能只用maxlength<van-field v-if="editable" required v-model="faultForm.lineId" name="lineId" maxlength="30" label="线路" placeholder="请填写线路名称" :rules="[ {required:true,message:'线路不能为空'}, {required:true,validator:textMaxLength,m

原创 vant uploader组件，回显文件、文件名

效果：刚开始的时候不回显文件名称，new了一个File，传入文件名就可以了父组件<van-field v-else name="gzsmwjys" label="故障说明文件(原始)" :required="gzsmwjysRequired"> <template #input> <!--把vant uploader封装成组件--> <VantUploader type="gzsmwjys"

原创 javaScript常用处理数组，字符串的函数

javaScript是解释型语言，在运行时解释，并立即执行。（类似火锅，边涮边吃）Java是编译型语言，在运行之前先进行编译，生成class文件，编译不出错才能执行。（所有菜炒好再上菜）数据类型js是弱类型语言，在声明时没有指定变量类型，通过赋值确定变量类型。字符串拼接consolelog('hello'+'world')let age=20consolelog(`今年${age}岁`) 布尔型运算console.log(true+1) // 2console.log(false+1

原创 监听window.onhashchange

<script> window.onhashchange = function(event) { console.log('ceshi',event.oldURL, event.newURL); let hash = window.location.hash //通过location对象来获取hash地址 console.log('#hash',hash) // "#/notebooks/260827/list" 从#号开始 }

原创 vue插值表达式——渲染复杂对象

arr=[{id:‘1’,name:‘张三’,obj:{id:‘101’}},{id:‘2’,name:‘李四’,obj:{id:‘102’}}]在{{}}表达式加 if 判断 ，避免页面报错<div v-for="(item,index) in arr" :key="index"> <div v-if="item.obj">{{item.obj.id}}</div></div>...

原创 this.$route用query传参为对象类型时要用json封装

this.$router.push({name:'list',param:{id:id}});优点是不会在url中展示出来，缺点是刷新一下数据就undefinedthis.$router.push({ path: '/list', query: { id: id}})这种path配合query的写法参数id会在url中，但是刷新还会存在；但是还有一种bug，this.$router.push({ path: '/list', query:{ row: row}})这样传一个行对象的时候，

原创 elementui form表单 动态绑定prop

表单中的数据是循环tasks动态展示的form:{ tasks:[],},<el-form :model="nextTaskForm" ref="nextTaskForm" :inline="true"> <el-row :gutter="10" v-for="(item,index) in nextTaskForm.nextTasks" :key="index"> <el-form-item label="下个节点名称：" :prop="'nex

原创 elementui表格type=“index“时，翻页自增

原创 CSS自适应postcss.config.js，过滤特殊类selectorBlackList

selectorBlackList:[’.el’]过滤掉.el开头的类，这样在移动端也可以使用element-ui的样式

原创 js文本换行

vant宫格组件，文字过长换行会把上面的图片挤上去解决方法：给文本留两行 ，js里处理文本换行<div class="productName" v-html="getProductName(name)"></div>getProductName(name){ if(name.length<8){ name+"<br>&nbsp;" //后面一定要加个空格才有效果 }else if(name=="这个字数好长好长好长"){ name="这

原创 动态取data1和data2变量名称

记录下这种写法一个页面有两个table，我就简单命名tableData1和tableData2（当然一般大家都不推荐这样命名变量，主要是这两张表格信息处理的方式一摸一样）之后改为下面这种写法代码比较简洁，前提就是两个变量处理方法都是一样的this["tableData"+type] //或者 this[`tableData${type}`]...

原创 elementUI表格的数据动态渲染，表格数据有修改后及时更新展示

业务是做个打勾的表格遇到的问题：点击全选后代码里把表里的数据全部改为选中，但是页面上并没有立刻改变，要在页面上停留一会到处点点才会出现选中的状态像这样：watch监听table的值已经改变了，就是渲染不及时，重新阅读api文档加了一句话记就好了...

原创 elementui获取＜select＞选中标签的所有数据

一个记录信息的表格需要用选择器在选择一个人名后想要获取这个人的所有信息<el-select v-model="prodForm.duty_spare_user_name" value-key="user_id" filterable placeholder="请选择值班人" @change="selectUser"> <el-option v-for="item in dutyUserList" :key="ite

原创 手动下载jar包添加到maven本地仓库

gitHub上拉一个项目，install的时候无法下载一些版本的jar包，像这样飘红首先要知道pom文件中的包都是从本地maven库中下载首先把新拉下来的项目maven设置成用本地库在这里搜索你需要的包名 https://mvnrepository.com/选择版本下载jar包下载到自己的电脑里，然后记住这个地址，之后添加到maven本地仓库需要用到下载到本地仓库的命令：mvn install:install-file -Dfile=C:\Users\ysu\Downloads\c

原创 正则表达式语法

[a-z] 匹配所有小写字母[A-Z] 匹配所有大写字母[a-zA-Z] 匹配所有的字母[ABC] 只能匹配“ABC”，顺序不能改变[0-9] 匹配数字0~9当 ^ 在 [ ] 里表示匹配相反的当 ^ 不在 [ ] 里表示匹配限定开头[^a-z]匹配：除了小写字母以外的所有字符^[a-z][0-9]$ 匹配：第一个字符是以小写字母开头，一个数字结尾的 （a1、d2…）^[a-z]+[123]$ 匹配：以小写字母开头，123结尾的 （aaa123、jdhjskfhjsdkah123…）

原创 Redis事务

Redis事务操作Multi 开启事务EXEC 提交事务Watch 可以监听一个或多个key，在提交事务之前是否发生了变化，如果发生了变化就不会提交事务，如果没有发生变化才会提交事务。Discard 取消提交事务redis是单线程的，它可以通过一个线程去维护多个不同的io操作，它不会有脏读的情况出现redis事务和mysql事务有哪些区别？redis不支持隔离性，mysql中开启了事务，其他线程不允许对这个事务有操作，但是redis即使开启了事务，其他线程也可以对它进行操作，Redis没有

原创 mock模板数据

mock中的可以动态随机生成名字@cname()生成0~10的随机数@natural(0,10)export const QueryWorkItemQty = { url: kingdee.QueryWorkItemQty, type: "post", data:{ "type": true, "msg": "Success", "models": [ {

原创 windows下安装nginx并设置成服务，开机自启动

首先去官网http://nginx.org/en/download.html下载nginx随便解压在哪个盘进入到exe的那一级目录中，直接在图地址栏输入cmd快速进入命令窗口输入命令 start nginx打开任务管理器，确认下是否有nginx这个进程然后开个浏览器输入localhost:80 显示如下图 就说明nginx启动起来了然后设置为服务打开链接https://github.com/winsw/winsw/releases下载后缀为.NET4.exe的下载好了之后改名为n

原创 vue打包后遇到报错Uncaught SyntaxError:Unexpected token ‘＜‘

检查config文件的这里 publicPath属性我之前写的 publicPath:’./’改成了 publicPath:’’ 就好了

原创 前后端分离项目 springboot后端用CORS解决跨域问题

记录一下

原创 el-upload手动上传图片的坑

需求：选取需要上传的图片后，回显，可删除，每次只允许上传一张图片，点击上传按钮在上传到服务器。elementUI的坑：想让选图片和上传动作分开的话设置:auto-upload="false" ，但是:before-upload="beforePictureUpload" 上传文件前的钩子就会无效，且图片也不会回显出来，如果我去掉这个:auto-upload="false" 则会出现图片我的代码：我添加了:auto-upload="false"属性在上传前的钩子函数中，创建一个临时的图片地址te

转载 idea新建类时自动生成作者注释

setting中设置，每次新建类时自动生成注释// ${USER}自动读取PC名字，也可以写死这个名字/** * @Author ${USER} * @Date ${DATE} ${TIME} * @Version 1.0 */

原创 记录vue项目 前端解决跨域问题

前后端分离模式下的跨域问题，那种请求其他公司的后端接口config.js文件中PS：这里secure:true是在官网看的，请求https需要开启安全证书，结果请求时发现不需要证书……请求报错信息：Proxy error: Could not proxy request……并且提示UNABLE_TO_VERIFY_LEAF_SIGNATURE，应该是证书问题查了一下这个问题，之前用postman测试时也遇到了不需要证书的问题，postman只要关掉这个选项即可，设置为OFF。代码中 只要加