- 博客(44)
- 收藏
- 关注
原创 jsdiff + diff2html【jQuery】实现文件对比功能
本文介绍了使用jsdiff和diff2html实现文本差异对比的方法。jsdiff是一个JavaScript库,用于计算文本差异,支持自定义补丁生成;diff2html则可将差异结果转换为HTML格式展示。文章详细说明了如何通过npm安装这两个库,并提供了核心代码实现: 使用Diff.createPatch生成标准diff格式数据 通过Diff2Html.html转换为可视化HTML 实现左右面板同步滚动功能 解决了flex布局冲突和无差异文件显示问题(需修改diff.js源码) 特别提供了处理无差异文件时
2025-08-11 17:23:11
491
原创 vue elementui select下拉库组件鼠标移出时隐藏下拉框
属性是设置弹出框的位置的,设置为false比较方便我们通过当前select去获取对应的下拉框元素,如果设置为true的话对应下拉框元素会在最外层,不方便拿到并设置。参考至 https://blog.youkuaiyun.com/Z18834071903/article/details/138799731。如果有这样的样式问题可以给select设置单独的class,然后设置以下的scss。事件,当鼠标离开时通过唯一标识ref设置select 下拉框隐藏,并做失焦。
2025-02-12 17:39:51
1067
原创 本地项目显示正常,打包部署后ElementUI图标全部显示异常为小方框
本地项目显示正常,打包部署后ElementUI重点饿图标全部显示异常为小方框和build配置有关
2024-12-18 11:04:15
961
原创 luckysheet 冻结行列时插入图片点击显示异常
表格插入图片正常显示,但是冻结行列下,点击表格空白处时插入图片和抽屉一起消失了(但消失的图片仅是点击前锁定的active图片)根据报错排查,在点击图片处理中 所触发的 freezen.js 中的 scrollAdaptOfImage方法时,使用了。相关方法已经实现了当前锁定插入图片的显示 ,但是因为,当前还有另一个css属性控制了图片的显隐。所以修改方案为,同事修改 visibility 属性值,以保证图片的显示。经排查,在表格的mousedown事件中会调用。的相关变量,但是当前文件并未引入相关js。
2024-11-14 16:16:12
374
原创 luckysheet 公式切换选中单元格失败解决
在使用 TODay 方法生成时间 并且 使用 WEEKNUM 公式后,再次进行编辑 WEEKNUM 公式 切换为另一个 TODay 日期进行获取,但是无论是值还是再次编辑锁定选区没有更改的变化。获取到的 formulaRunList 公式组应当是没有当前单元格的公式的。经排查,在每次编辑回车保存时,都会去进行公式组的遍历和判断。
2024-11-05 11:03:52
468
原创 luckysheet SUMIFS公式跨sheet页选区时异常问题解决
其中的执行逻辑为:每次选区的时候会使用这个变量 functionHTMLIndex 去生成对应选区的唯一index值,在切换sheet时会根据这个index 去获取选区的dom元素 然后进行光标的重置,但是在当前的跨seet公式执行顺序中,切换回来sheet再进行选区之后,因为进入了当前判断 所以那个选区的index重置为了0,获取对应dom元素(为0的就有多个,默认获取到了第一个),光标元素混乱了所以导致了光标混乱的问题。
2024-11-05 10:53:16
875
原创 luckysheet WEEKNUM / ISOWEEKNUM公式使用报错 isoWeeks is not a function问题解决
原本的报错 使用过 try catch 在 catch 中抛出的异常 : isoWeeks is not a function。原本的报错与dayjs / vue 版本等有关系,采取的是迂回的修改方案。功能:获取当前日期在一年中的周数(跨年的周在上一年是。1、引入(也可以在其他的js中 自己随便即可).js中相关的两个方法 (可按照对应行数找):使用相同功能的方法去替换原本报错的。2、在对应引入的文件中导出对应方法即可。在luckysheet中 公式。进行相关异常方法的替换。就是替换的自定义的方法。
2024-11-05 10:08:51
701
原创 git报错:failed to push some refs to ‘xxx‘
git报错:failed to push some refs to 'xxx'
2022-11-30 13:57:10
404
转载 Node Sass does not yet support your current environment问题解决
Node Sass does not yet support your current environment问题解决
2022-07-04 14:26:45
3857
原创 elementui时间选择器样式修改默认样式---修改宽度---修改日期图标
原先的代码<el-form-item label="时间选择"> <el-date-picker v-model="time" //绑定的数据,如果不绑定的是无法进行时间的选择 unlink-panels //默认情况下左右面板会联动。如果希望两个面板各自独立切换当前月份,可以使用unlink-panels属性解除联动。 type="daterange" format="yyyy-MM-dd HH:mm:ss" //时间格.
2022-01-26 10:25:48
14628
5
原创 Echarts柱状图
创建一个图表容器,初始情况必须给这个图表一个宽高,如果这里没给,在下面获取容器的时候也可以给<div id="myChart" :style="{height: '250px'}"></div>获取div容器myChart(参数) { var myChart = this.$echarts.init(document.getElementById('myChart')) 如果初始没设置图表容器的大小,可以在这个进行设置 /*var myCh
2022-01-24 17:04:55
995
转载 报错:‘xxxx‘ is declared but its value is never read.Vetur(6133)
报错:解决方法:在设置中搜索vetur,找到Validate js/ts in
2021-12-27 17:48:56
10570
原创 弹性布局flex属性
Flex一、为什么首先flex的出现是为了解决一些情景布局,方便我们进行设置我们想要的一些布局样式:经典垂直居中我们要实现垂直居中也可以设置 position 【left + margin-left / translate】但是要进行计算或者设置属性较多不免有些麻烦二、是什么Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。每一个盒子都可以通过 display:flex 被设置为 一个 flex容器在这个flex容器中我们可以通过设置一些属
2021-10-25 16:31:46
332
原创 原生js实现轮播图
轮播图实现轮播图实现功能:点击左箭头轮播到上一张图片点击右箭头轮播到下一张图片实现图片的自动轮播当鼠标进入轮播图则停止自动轮播当鼠标离开轮播则开启自动轮播实现点击对应小圆点实现显示对应index图片轮播图实现思路及过程代码:1、首先搭建html,整个轮播图时content部分轮播图中分为`图片`部分和`左右箭头`和`小圆点`三部分html代码<div class="content"> //图片区域 <div class="imgs">
2021-10-22 14:38:43
244
原创 JS继承的六种方法
①原型链继承 将父类的实例作为子类的原型【因为实例对象是沿着原型链进行继承的(和构造函数无关)】//爸爸function Father () { //}//儿子function Son () { //}//原型链继承核心Son.prototype = new Father()//如果不手动指回来的话 Son.prototype.constructor = Father了//因为Son.prototype是Father的实例赋值过来的//那么Father 的实例的constru
2021-09-21 15:20:06
509
原创 写一个函数判断对象中是否存在循环引用
对象中存在循环引用的意思var obj = { name: 'dpn', a: { b:{} }}obj.a.b= obj在对象 obj 中存在某个属性值或者这个属性里面的属性值 === obj的情况就是对象中存在循环引用如上:也就是 obj 这个对象中有一个属性 a ,这个属性的属性值是一个对象,a这个对象里面有一个属性 b ,这个属性b的属性值是一个对象然后这个对象的值就是 obj 这个对象本身这个 obj 对象被循环引用了检测对象中是否存在循环引用基本思路:首先定义一
2021-09-15 15:08:36
986
原创 实现一个函数clone,可以对js中的5种主要的数据类型(包括number string object array Boolean)进行值复制
function copy(val) { var o var type = val.constructor switch(type) { case 'Number': o = val - 0; break; case 'String': o = val + ''; break; case 'Boolean': o = !!val; break; case 'Array': { o = [] for (var i = 0; i < val.leng
2021-09-14 10:34:54
330
原创 JS基础复习
JavaScriptJavaScrip由三部分组成:一、javascript基本内容:1、js的运行环境 浏览器 (前端语言) node.js (后端语言)2、js的组成 ECMAScript 【基础语法】 DOM 【文档对象模型】 浏览器为js提供的操作 html 的API BOM 【浏览器对象模型】 浏览器为js提供的操作浏览器的API3、js的特点1)既可以作为前端脚本语言,还可以作为后台语言(取决于它运行的平台)2)解释型语言,不需要编译
2021-09-08 23:39:43
400
原创 检测变量的数据类型
要检测的数据类型有:基本数据类型:Number、String、Boolean、Null、undefined引用数据类型:Function、Array、Object、Error、JSON、RegExp(正则)以下为创建的检测数据函数function fun (name,age,na,li) { console.log(this)}数组var arr = [1,2,3]对象var obj = { name: 'dpn'}字符串var str = 'dpn'数字var num
2021-09-03 16:23:10
1267
原创 改变this指向的三种方法
call方法:语法: function.call(thisArg, 参数1, 参数2, 参数3...) function: 要改变this指向的原函数 thisArg: 要改变到的this指向的目标对象function fun (name) { this.name = name console.log(this)}var name = 'dpn'var obj = { name: 'dpn', b: function () { console.log(this.nam
2021-09-03 12:00:10
1220
1
原创 Html、CSS面试总结
1、请说说你对标签语义化的理解?(1)一个语义元素能够清楚的描述其意义给浏览器和开发者,即使在去掉或丢失样式的时候,也能够让页面呈现出清晰的结构;(2)有利于SEO优化,让页面和搜索引擎建立良好的沟通,爬虫依赖于标签来确定上下文和各个关键词的权重,有助于爬虫抓取更多的有效信息;(3)方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备等),并以具有意义的方式来渲染网页;(4)便于团队开发和维护,语义化更具有可读性,遵循W3C标准的团队都遵循语义化标准,可以减少差异化;2、HTML5 有哪些新特性,
2021-09-02 20:32:37
187
原创 数组去重十种方法
定义一个数组和一个新的空数组var arr = [1,'true','dpn',1,2,'3',3,'false','dpn',1,'leave']var arr1 = []1、indexofarr.forEach((element) => { if(arr1.indexOf(element) == -1) { arr1.push(element) }}); console.log(arr1)2、双重for循环for (let i = 0; i < arr.lengt
2021-08-31 18:53:43
741
原创 JS 普通函数、匿名函数、箭头函数 的特点和区别
1. 普通函数 【具名函数】普通函数存在 函数声明的提升普通函数的定义:关键字(function) 函数名 (参数){ //参数是形参(形式参数) 函数体 return xxx}普通函数的调用: 函数名(参数) //参数是实参(实际参数)形参和实参: 形参(形式参数):就是我在这个地方占个位,表示这个地方有一个参数,我给他一个形式的名字用来表示我要占的这个坑的名字,在封装的函数里面会用到这个形式参数来代表之后函数真正传进来的值进行运算。 实参:再调用函数的时
2021-08-30 20:56:45
4304
1
原创 实现city和city首字母对应滚动
实现 左边(由首字母排列的city)和 右边 字母 相对应滚动一: 实现点击不同的字母时(右边),左边就会滚动跳转到对应的字母列表实现两个子组件之间传值左边是List子组件右边是Alphabet子组件传值步骤:给Alphabet子组件字母绑定点击事件在点击事件中用 $emit(‘触发事件名称’,参数) 触发一个事件(参数就是点击的字母),并且在父组件中对应的子组件标签中 绑定触发事件 对应的方法(methods中)【给一个元素绑定点击事件时点击函数的参数e代表的是点击的这个点的
2021-08-25 11:48:40
218
原创 better-scroll数据动态加载后无法滚动
在通过定位(position)的方法使页面无法滚动后(鼠标滚动),引入 better-scorll 实现动态滚动(触摸滚动)先通过npm下载better-scroll官网:https://github.com/ustbhuangyi/better-scrollnpm install better-scroll --save然后通过import再要使用滚动的页面引入better-scrollimport BScroll from 'better-scroll'mounted: funct
2021-08-25 09:35:18
883
原创 内容撑开浏览器滚动是设置页面不滚动
.title { position: absolute; overflow: hidden; top: 0; left: 0; bottom: 0; right: 0;}这个盒子(设置定位的盒子)的父定位元素必须是浏览器这样设置盒子为绝对定位就会脱离文档流定位的位置是相对于他的父元素(也就是浏览器)分别设置上、下、左、右 定死了这个盒子的大小就是浏览器视口的大小然后oveflow:hidden(不设置right也可以,因为上下滚动,需固定好,右边不会留有余地)这样页
2021-08-24 17:15:04
220
转载 vue启动的时候报错 Mixed spaces and tabs
报错原因:Mixed spaces and tabs(混合空格和制表符)。大多数代码约定要求使用空格或 tab 进行缩进,因此,一行代码若同时混有 tab缩进和空格缩进,通常是错误的,需先删除报错的地方的空格再进行编译错误:正确:原链接:https://www.jianshu.com/p/3a352f6e2521...
2021-08-23 20:13:33
1999
原创 padding-bottom/top实现占位 占位的另一种方法
有一种布局上面有一个img图片,下面有一个content<div class="asd"> <img class="swiper-img" src="http://img1.qunarzz.com/sight/p0/1409/19/adca619faaab0898245dc4ec482b5722.jpg_350x240_8e61302a.jpg" /></div><div>content</div>存在一种情况如果上面的img没有加
2021-08-23 11:33:45
506
原创 初始化 reset.css文件
不是原创@charset "utf-8";html{background-color:#fff;color:#000;font-size:12px}body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,figure,form,fieldset,legend,input,textarea,button,p,blockquote,th,td,pre,xmp{margin:0;padding:0}body,input,textarea,button,select,pre,xmp,tt,cod
2021-08-20 14:43:14
156
原创 初始化border.css文件
@charset "utf-8";.border,.border-top,.border-right,.border-bottom,.border-left,.border-topbottom,.border-rightleft,.border-topleft,.border-rightbottom,.border-topright,.border-bottomleft { position: relative;}.border::before,.border-top::
2021-08-20 14:40:18
171
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅