- 博客(26)
- 收藏
- 关注
RSS订阅
原创 vue项目发版，前端页面自动提示用户刷新页面
首先，根目录下创建两个js文件，比如version-update.js这是更新用的，version.js这个是将特定标识写入项目中，以此来区分项目是否更新。背景：由于前端发版用户不及时刷新页面就会造成你看到的页面其实是发版之前的页面，需要每次手动刷新，现在封装2个方法，当有前端代码更新，自动提示用户手动刷新。然后在main.js中引用即可。
2023-12-15 11:00:45
1424
原创 前端table表格的全选/反选/跨页勾选（封装）
前置条件1：table表格里面必须有一项是作为这一条数据的唯一值，比如：id，必须要有的！前置条件2：点击全选按钮，需要调接口，让后端给你返全部需要勾选的数据：pathologyId，例如【1，2，3】这样我们才知道全选选哪些数据。前置条件3：点击反选按钮，需要调接口，让后端给你返全部需要勾选的数据：pathologyId，例如【1，2，3】这样我们才知道反选选哪些数据。先定义selectListIds ：【】,为了知道哪些数据是要选中的。前提：项目需要，想要一个可以全选，反选，跨页勾选的需求。
2023-12-29 12:09:13
720
原创 git 不小心删除未commit的新文件
等我把b分支紧急需求搞完，回到a进行git stash pop。我傻眼了，因为新建的两个文件被我删掉了。这时候是没有commit的，仅仅是在本地开发的且还被我删掉了。各种方法都找不到了。在一阵操作下也找不回来，最后心灰意冷了，打算重写！我这个人有点毛病，重写我也是起同样的名字。vscode有个时间线功能，你点击新建的文件的名字，打开时间线就能看到你保存的记录，点进去就能看到你的代码。
2023-09-06 11:16:46
203
1
原创 封装快捷时间选择
注意点：我们的上个工作日是根据系统配置的工作日来的。所以在处理上个工作日时会调接口。系统配置的工作日如图：用户可以随意设置周一至周日的哪几天为工作日。用户可以快捷选择，前端把处理好的时间给后端。
2023-09-06 10:13:13
75
原创 el-input的textarea，中文数字符号一起输入时，换行有问题
做需求发现，input输入一大串中文数字符号换行有问题。这里实际我没有输入任何换行符的。加一行代码即可解决。
2023-09-05 10:22:34
418
原创 同一个浏览器登录不同账号，设置只允许登录一个账号步骤
/ 同时满足key为USER_STORAGE_TOKEN_KEY, oldValue不为空, 且ev值变化, 则提示用户登录信息变化。MessageBox.alert('当前登录用户信息已过时，请点击刷新页面', {第三步：在main.js中监听token变化。第一步，新增constant.js文件。// 统一添加用户token变化监听,d第四步：在无权限访问的页面进行配置。
2022-11-18 11:48:01
1374
原创 element的table表格tooltip快速滚动时候会造成scroll高度被撑开，导致浏览器出现滚动条
起因：页面涉及到滚动下拉加载数据，一次显示50条，第二次调第二页的50条，table表格中对数据进行了处理，使用了el-tooltip，鼠标放上时候el-tooltip会有个延迟，这时候快速滚动el-tooltip还存在，会导致表格的高度被撑高，浏览器出现滚动条。处理：既然是el-tooltip引起的，那就让el-tooltip在table表格滚动到下面时候消失，这样就不会造成el-tooltip滚到下面还占位的情况监听滚动事件，获取tooltip，去判断tooltips.length，然后设置它的属性..
2022-06-20 11:26:24
1556
原创 el-select多选时候之后，展示多选条件不允许被删除
效果如图：第一步：el-select 加一个ref属性，例如：ref="medicalAdviceRef"，为了操作js用，第二部：
2022-06-20 11:19:05
2489
1
原创 table表格，快捷键下一条数据高亮之后，滚动条自动滚动到高亮的那一条
思路：拿到高亮的表格数据，计算距离视口的高度，也拿到表格距离视口的高度，两者相减，利用scrollTop的滚动来控制滚动条代码如下： tableScrollMoves(refName, index) { if (!refName || !this.$refs[refName]) return// 不存在表格的ref vm 则返回 const vmEl = this.$refs[refName].$el if (!vmEl) return //
2022-03-24 18:36:18
561
原创 下载word/xlsx等文件，和下载txt。jpj文件区别以及具体操作
txt/jpg使用方式：下载downloadFile(obj) { if (!obj.filePath) return const downloadElement = document.createElement('a') const url = obj.filePath fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址 downlo..
2022-03-23 17:33:54
687
原创 快捷复用页面（单纯想记录下）
<template> <div class="experimentInfo-container"> <el-table :data="tableData" class="borderColor" border :cell-style="{borderColor:'#C4C7CB',padding:'0'}" :header-cell-style="{borderColor:'#C4C7CB'}" .
2022-03-23 09:59:15
289
原创 vue列表手动拖拽排序
需求：列表可以手动拖拽进行排序如图所示，是通过鼠标拖拽实现的。1，页面中引入 import draggable from 'vuedraggable'2，html中使用，将要拖拽的内容进行包裹3，
2022-03-22 17:10:14
474
原创 el-select已经选择的下拉框的值不可以再次被选择
需求：每次点新增按钮，列表typeList就会新增一条可以选择的下拉菜单，如果一个下拉菜单绑定了一个a，那么新增之后的下拉菜单里面的下拉选项a是属于被禁用的状态，只能选择别的未被禁用的选项实现：1，首先把下拉菜单的options拿到，，把里面的每一项新增一个item.disabled=false的属性，这样可以去控制下拉框是否禁用2，刚进入页面调列表接口，拿到一进页面返回的typeList，拿到里面已经被绑定的option，把这些option放在一个数组里面，为了跟操作1的数组进行对比
2022-03-20 14:56:14
3756
2
原创 在el-dialog中动态创建的iframe，监听iframe里面的标签是否被点击
在el-dialog中动态创建的iframe，监听iframe里面的标签是否被点击
2022-02-09 15:20:28
1857
原创 鼠标下拉滚动动态加载数据
html: <div class="left borderRadius8" @scroll="scrollLeft"></div>data中：shouldGetData: true,method: async scrollLeft(e) { // 向下滚动加载列表 if (!this.shouldGetData) return if (e.target.scrollHeight - (e.target.scrollTop + e.target.c.
2022-01-20 14:41:46
623
1
原创 封装el-date-picker，选择某年某月某日时候，往前最多可选择6个月，往后也是最多只能选择6个月
<template> <el-date-picker v-model="timeData" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOption" value-format="yyyy-MM-dd" @change="handleChangeDate" ></el-date-pi.
2022-01-05 11:53:17
1250
3
原创 element的input框修改为可输入可下拉
html结构：<el-autocomplete ref="department" clearable class="inline-input" v-model="form.sendInfoRequestDTO.department" :fetch-suggestions="querySearch1" placeholder="请输入内容" @select="handleSelect1" @clear=..
2021-11-19 13:18:53
895
原创 openseadragon使用教程，很简单但是搞了一上午
1.首先去openseadragon官方文档，地址：https://openseadragon.github.io/，如图下载下载完成之后会有一个压缩包openseadragon-bin-2.4.2.zip，将压缩包解压拿到一个文件夹，文件夹里面这两个是需要的，其他忽略。2：http://www.softsea.com/download/Deep-Zoom-Composer.html这个网址下载Deep Zoom 按提示安装在自己电脑内就有一个程序：，使用链接如下：https://blog.cs
2021-11-02 15:15:27
2891
原创 小方法记录
1.// 处理文字过长的问题const ellipsisText = (val, num) => {if (!val) return ''const len = val.toString().lengthreturn len > num ? val.substring(0, num) + '...' : val}2.// 格式化留言的日期const isToday = val => {if (!val) return ''const today = momen.
2021-10-28 10:53:14
86
原创 本地vscode保存自动按项目中eslint文件规范格式处理
module.exports = { root: true, parserOptions: { parser: 'babel-eslint', sourceType: 'module' }, env: { browser: true, node: true, es6: true, }, extends: ['plugin:vue/recommended', 'eslint:recommended'], // add your custo.
2021-10-28 10:45:36
148
原创 object-fit*
object-fit设置图片在某一个有宽高的固定盒子内进行展示，不影响原来图片的宽高比例。contain被替换的内容将被缩放，以在填充元素的内容框时保持其宽高比。 整个对象在填充盒子的同时保留其长宽比，因此如果宽高比与框的宽高比不匹配，该对象将被添加“黑边”cover被替换的内容在保持其宽高比的同时填充元素的整个内容框。如果对象的宽高比与内容框不相匹配，该对象将被剪裁以适应内容框。fill被替换的内容正好填充元素的内容框。整个对象将完全填充此框。如果对象的宽高比与内容框不相匹配，那么该对象将被
2021-10-28 10:33:58
82
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人