- 博客(26)
- 收藏
- 关注
RSS订阅原创 input输入框按回车键后自动刷新页面
最近遇到了一个bug很有意思就想记录下来，就是input输入框在输入完之后按下回车会刷新当前页面。产生这种问题的原因是当form表单只有一个输入框时，按下回车会去提交表单（触发submit事件），按照这个思路可以有下面几种解决办法在表单内在加一个看不见的input<input style="display:none;" />在表单内在加一个看不见的input...
2022-02-25 13:33:08
3938
原创 js数组去重的两种方法
使用es6中的 Setvar array = [1,2,3,2,3,4,4,5]function unique(arr){ var set = new Set(arr) return [...set]}这种方法只对数组里面为简单数据类型时有效2. 利用object中键值的唯一性function unique(arr){ var obj = {};res = [] for(var i = 0;i < arr.length;i++){ if(!obj[arr[i]]){ o.
2021-10-19 11:13:26
137
原创 javascript反转字符串的几种方法
1.利用字符串和数组的apifunction reverse(str){ return str.split('').reaverse().join('')}这种方法比较省事。。。推荐（主要代码少写着省事）倒序循环function reverse(str){ var str = "" for(var i=arr.length-1;i>=0;i--){ str += arr[i] } return str}入门级思路。。双指针循环这种方法大致思路就是在第一次循环
2021-10-18 14:33:51
1008
原创 多维数组嵌套扁平化的两种方法
一个数组嵌套这多层数组，扁平化能够更方便的操作数据，下边用两种方法来实现：使用es6中的flatflat(n)方法接受一个参数，在这里插入代码片递归
2021-10-18 11:05:43
436
原创 使用递归实现深拷贝一个对象
在实际的开发过程中，在实现一些业务逻辑时很容易碰到深拷贝，大多数（包括我）都会去使用JSON.parse(JSON.stringify())这个方法去实现，但殊不知这种方法存在诸多弊端（例如会将时间对象转化成字符串，而且会丢失undefined以及函数，具体请自行百度），下边用递归来实现深拷贝一个对象，上代码：function recursion(obj) { if (Object.prototype.toString.call(obj) !== "[object Object]") return f
2021-08-10 14:40:24
387
原创 js中将图片文件转成base64
js中将图片文件转为base的两种方式fileReader <input type="file" id="file" onchange="changeFile()">function changeFile() { var file = document.getElementById('file').files[0] //检验选择文件格式 var fileType = file.name.split('.').reverse()[0].toLowerCase() var
2021-06-21 22:16:41
1020
原创 layui中tab页面切换表格宽度异常
最近再使用使用layui进行开发，看到了一个问题挺有意思的，就是一个页面是一个tab页，刚进来时layui-table能够正常渲染，在切换之后发现除了进来的第一个页面都存在table宽度异常的问题，就像压缩饼干一样非常丑，不过这可难不倒我（哈哈哈哈）解决思路：在tab页面切换的时候重置相对应表格的尺寸即可解决解决办法如下：在选项卡切换的时候会有一个监听事件：element.on('tab(filter)', function(data){ console.log(this); //当前Tab标
2021-04-13 18:10:40
1591
3
原创 echarts点击图表事件和鼠标悬浮事件
在使用echarts开发过程中，经常会遇到一些需求就是点击图表或者鼠标悬浮在图表上有接下来的相关动态操作，只需将获取的echarts实例添加监听事件即可实现。鼠标点击echarts图表const myChart = echarts.init(document.getElementById("myChart"))myChart.on("click",function(params){ console.log(params) //这里的params是鼠标点击的图表节点的数据})鼠标点击echa
2021-04-07 10:13:27
7421
1
原创 echarts更新数据不重新绘制图表
在使用echarts进行可视化图表的开发时，由于option配置项配置项太多，在进行一些动态操作时我们一般情况下都是去直接更新series里面的数据来更新页面图表的数据。这就产生了一个问题，当series里面的数据条数不相等时，再重新对获取echart实例进行setOption，当更新的数据少于之前数据时，会发现页面回遗留下之前的数据，包括图例。解决办法:给setOption这个方法加上第二个参数true，重新绘制整个图表（默认是false）配置项手册myChart.setOption(option,tr
2021-04-06 15:30:50
11631
4
原创 echarts鼠标悬浮浏览器页面抖动
在使用echarts开发可视化图表时，突然遇到了一个问题，就是刚进来这个页面时，鼠标悬浮到饼图上会有一个页面抖动的现象，再次悬浮上去就不会抖动了。查阅文档得出解决办法如下tooltip:{ transitionDuration:0,}...
2021-04-06 14:04:53
491
原创 element中Tabs标签页切换echarts绘制宽高异常
在vue项目的开发中用到了Tabs标签页，但是在这些标签页切换的过程中会出一个问题，就是在echarts容器的宽高设置成百分比的时候 ，echarts图表并不能够完整地撑满整个容器，而是一张压得很扁的一张图，导致出现这种问题的原因就是tab页在切换的过程中，他是通过display:none来实现tab页的显示隐藏，这样的话点击tab页的时候，下面的具体内容部分正处于display:none 这个状态，echarts在获取dom容器时，并不能够准确识别出dom的宽高，进而会出现图表被压扁的情况，解决办法
2021-03-11 10:21:44
564
原创 在文字前后加上特殊符号的实现方法
在开发的过程中可能会也遇到一些需求在文字前后加上一些特殊符号，以书名号为例，现在简单说下两种实现方法js拼接字符串<div></div>var name = "平凡的世界"name = "《"+ name + "》"$('div').html(name)css伪类<div></div>div::before{ content: "《";}div::after{ content: "》";}$('div').
2021-03-09 14:44:51
25471
原创 自定义鼠标右键样式
今天碰到一个需求就是要在鼠标右键点击的时候出现自定义选项卡，话不多说直接附上代码首先先写一个列表在这里插入代码片js代码document.oncontextmenu=function(e){ var event = window.evnent ||e if(event.preventDefault) { event.preventDefault()//阻止右键点击的默认行为 } else { event.returnValue = false //ie浏览器 }}
2021-03-08 17:00:33
249
原创 uni-app原生子窗体subnvue
在使用uniapp进行开发app时，由于部分组件如map、video、textarea、canvas通过原生控件实现，原生组件层级高于前端组件，会使一些组件被挡在下面，很多人会想到使用cover-view（cover-view覆盖在原生组件上的文本视图。）这个组件，但是这个在h5端调试的时候是可以的，在app真机调试时还是不行（其他端我没试过）附上代码cover-view<cover-view style="height: 600rpx;position: relative;"> 这是文
2021-03-02 17:46:34
1234
原创 Failed to execute ‘setRequestHeader‘ on ‘XMLHttpRequest‘ 报错处理
在工作过程中出现了这个错误 Failed to execute ‘setRequestHeader’ on ‘XMLHttpRequest’ ，结果就是ajax请求无法发送,我们大致翻译下就是请求头里出错导致的，原因我以前也没遇到过这个问题，查看资料后才知道是因为请求头里面放了中文导致的。解决方式但是我们真的必须把中文传给后端的话，可以使用encodeURIComponent()`来编译中文字符，然后后端接受到数据解码就可以了。...
2021-01-27 15:42:15
8913
原创 CSS-文本溢出显示省略号
在开发过程中有时候文本过长会导致页面样式错乱，可以用css将超长文本溢出部分用省略号来显示。div{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
2020-12-18 14:29:49
110
原创 echarts有数据但是无法绘制图表
碰到了一个上一任开发人员遗留下的bug，就是在第一次进页面的时候能正常渲染echarts图表，当请求接口数据发生改变时发现页面上一片空白啥都没有如下图；前一任留下的代码类似下面这种 <div id="chart" style="position: relative; width: 500px; height: 500px;margin: auto;"> </div><div style="text-align: center"> <but
2020-12-10 15:01:50
4479
2
原创 地图中获取覆盖物中心点
碰到一个需求要绘制n个数量的多边形，且名字必须在地图的中心点，但是高德地图的绘制多边形的api没有带绘制文本标注的功能，只能算出中心点的坐标并且再把文本标注上去。话不多说直接上代码getAreaCenter(location) { var total = location.length; var X = 0, Y = 0, Z = 0; location.forEach( lnglat => { var lng =
2020-12-09 15:03:25
1037
2
原创 css元素子元素自适应大小的两种方法
简单说下css中子元素自适应大小的两种办法1. 子元素设置百分比<div class="box"> <div class="content"></div></div>.box{ margin:100px auto; width: 100px; height: 100px; background: rgba(0, 0, 0, 0.6);}.content{ width: 80%; height: 80%; margin-top: 1
2020-12-07 14:36:35
3847
原创 Vue项目中element表单的循环校验
在工作中碰到了一个需求，就是返回数据在表单里循环显示，在提交的时候就得对表单进行循环校验，但是使用element普通的校验方法是不生效的。需要对el-form-item 设置单独的props和rules。props中items是循环的数组，index是循环的index，后边拼接的是需要校验对象的字段名，rules是校验规则可以再data中设置，校验方式都是一样的，话不多说直接上代码：<el-row :gutter="80" v-for="(shop, index) in form.items
2020-11-09 11:03:44
2664
原创 写一些我工作中遇到的问题吧
最近工作遇到的些问题总结下希望能帮助到大家关于es6数组的解构可以设置默认值来进行数据判空避免报错let array=[ [1],[2,3],[4]] let [ res1,res2=[],res3=[] ]= arrayconsole.log(res1,res2,res3) //[ 1 ] [ 2, 3 ] [ 4 ]array=[ [1]]let [ res1,res2=[],res3=[] ]=arrayconsole.log(res1,res2,res3)//[ 1 ]
2020-11-09 10:25:26
831
原创 关于函数的小技巧
懒人必备 关于函数的两个小技巧1.当函数返回的只有一行语句，可以省略大括号，也可以省略return关键字//函数中只有一行语句var summary = (a,b) => a+bconsole.log(summary(10,20)) //302.需要对返回数据处理用到数组的一些常用API时（如 Array.map()，Array.forEach()，Array.reduce()等等 ）在对数据进行简单处理的情况下也可以省略掉returnvar array=[{name:'test',v
2020-10-29 17:26:46
276
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人