- 博客(32)
- 资源 (2)
- 收藏
- 关注
原创 el-table纵向和横向都有滚动条的时候,右下角会出现白色方块区域
el-table 是饿了么里面的表格,展示数据很方便,但是有一些不知道的样式覆盖的时候比较麻烦,这里总结一些,希望对大家有一点帮助。滚动条的选择器:::-webkit-scrollbar 表格的整个滚动条::-webkit-scrollbar-thumb 表格的滚动条::-webkit-scrollbar-track 页面的滚动条::-webkit-scrollbar-corner 表格...
2020-12-08 14:48:46
3845
2
原创 echarts 实现区域划分 折线图
先给出图表样式这张图看上去是个普通的折线图,但是仔细看又有一些不同,首先它是有区域划分的,不同区域,对应的线条颜色不一样,其次y轴是自定义的,还有各种标记等,总之是有很多构思在里面。echarts图例当中找了很多相似的折线图,但是都不能满足需求,于是动手自己绘制。废话不多说,直接上代码,小伙伴们可以参考下: let dom = document.getElementById("ichart"); dom.style.width = window.innerWidth / 4 + "px";
2020-11-26 14:21:02
4046
原创 正则表达式
元字符:^ 匹配行的开始 $ 匹配尾的结束. 任意字符(除了换行符)[ ] 字符类,匹配方括号中包含的任意字符[^] 否定字符类,匹配方括号中不包含的任意字符* 匹配前面的子表达式零次或多次+ 匹配前面的子表达式一次或多次? 匹配前面子表达式一次或零次,或指明一个非贪婪限定符{n,m} 匹配前面字符最少n次,最多m次(xyz) 按照确切顺序匹配xyz| 分支结构,匹配符号之前的字符或后面的字符。\ 转义字符,还原元字符原来的含义,允许你匹配保留字符 [ ]
2020-08-17 16:41:07
201
原创 前端通信:全双工,半双工,单工
单工:a和b说话,b只能听a说半双工:参考对讲机,A:能不能听到我说话,over B:可以可以,over全双工:参考打电话,A:哎,老王啊!@#!#¥#@!# B:@#¥@¥@¥#@数据通信中,数据在线路上的传送方式可以分为单工通信、半双工通信和全双工通信三种。单工是只能一个方向传递数据。(相当于单向车道,只能按照指定方向走)**半双工(Half Duplex)**是一种传送制式。使用同一根传输线既作接收又作发送,数据可以在两个方向上传送,但通信双方不能同
2020-08-04 11:00:39
369
原创 小程序 计时旋转动效
wxml <view class="status-container {{charginDetail.isFull ? 'full' : 'charging'}}"> <div class="score-bg-wrap"> <view class="score-annulus" /> <view class="score-annulus" /> <view class="score-annulus.
2020-08-03 17:33:55
180
原创 vue项目二级域名访问出来是空白页
默认打包出来的项目运行在根目录可以正常显示,如果在二级域名下就会显示空白,是因资源引用路径及路由模式不同导致的。vue.config.js 文件中可以将publicPath这个配置加上:module.exports = { publicPath: process.env.NODE_ENV === 'release' ? './' : '/', devServer: { disableHostCheck: true }, chainWebpack: conf
2020-07-29 15:10:07
934
原创 prototype,__proto__,constructor这几个你知道什么意思了嘛?
首先,JavaScript中万物皆对象。然后,其中对象分为两种:普通对象和函数对象。Object ,Function 是JS自带的函数对象。普通对象和函数对象:// 普通对象的定义方法 let a = new Object(); // typeof a === object let b = {}: // typeof b === object let c = new Person(); // typeof c === object// 函数对象 let a2 =
2020-06-28 16:26:55
217
原创 js中宏任务和微任务和Event-Loop
看看下面的一段代码?你觉得输出的是什么?setTimeout(_ => console.log(4))new Promise(resolve => { resolve() console.log(1)}).then(_ => { console.log(3)})console.log(2)跟你想象的一样的嘛?整个这一串代码我们所在的层级我们看做一个任务,其中我们先执行同步代码。第一行的 setTimeout 是异步代码,跳过,来到了 new Promis
2020-06-12 16:10:10
618
1
原创 uniapp开发微信小程序顶部固定,其他地方滚动
uniapp开发微信小程序实现顶部固定,其他地方滚动,也就是滚动条不出现在头部,只出现在腰部。效果图是这样的:1、页面<view class="alarm" :style="'background:'+ (showFilter ? 'rgba(0,0,0,0.45)' :'')"> <view class="default_con" :style="'height:' + (top + 100) +'px;flex: 0, 0, '+ (top + 100)+'px;'"&
2020-06-05 13:41:59
3574
原创 Echarts坐标轴和数据不对称,没有一一对应
echarts 中不管是折线图还是柱状图,如果x轴和数据不是自动产生的(也就是xAxis.data是和series.data都是单独生成的),那么就需要根绝x轴去匹配数据点。xAxis中data生成是这样的:["2019-06", "2019-07", "2019-08", "2019-09", "2019-10", "2019-11", "2019-12", "2020-01", "2020-02", "2020-03", "2020-04", "2020-05"]数据点是这样的:[name:
2020-05-28 15:16:37
9562
2
原创 element-UI 文件上传,只允许上传一个文件
elementUI里面文件上传已经写好,挺好用的,不过我今天遇到一个情况,花了我一点时间,所以还是在这里记录一下,也许你也会遇到这种情况,那就刚好可以看看。需求:点击上传一个图片或者PDF文件,只是假上传,在最后提交的时候才真正的上传,并且将上传的文件放到最后提交的接口中,并支持预览,下载,删除功能。官方给了上传头像的例子:// 官方上传头像<el-upload class="avatar-uploader" action="https://jsonplaceholder.typico
2020-05-27 19:26:24
7975
原创 Echarts 双坐标轴的时候 第二个坐标轴总是出不来?
最近一直在使用echarts,整理一下出现的问题,希望可以给刚接触的人一点帮助。Echarts 双坐标轴的时候 第二个坐标轴总是出不来?试试给第一个series添加的yAxisIndex =0 ;第二个series 的yAxisIndex = 1;你会发现“哎哟,出来了”;如果还没出来,再试试给第一个yAxis添加的min max 设置两个值;你又可能会发现“哎哟,出来了”;...
2020-02-20 17:11:14
2326
2
原创 前端实现-文件批量下载
文件下载:单个文件下载window.open(url)多个文件下载多个文件下载用window.open不行,你会发现他只下载了一个,并不是所有。let triggerDelay = 100;let removeDelay = 1000;this.urlList.forEach((url, index) => { this.createIFrame(url, index *...
2020-01-15 21:17:29
2639
2
原创 el-table底部空白,el-table__body-wrapper is-scrolling-left元素高度计算错误
element-UI里面table好用,但是也有很多问题,需要根据场景具体解决。今天说的问题就是:我要显示10条数据,给的高度也够,可是只显示了6条数据,需要我滚动才能显示剩下的,这样体验很不好。原因:element-ui 里面的bug。解决办法:动态计算table的高度。.assets-table /deep/.el-table__body-wrapper { height...
2020-01-15 14:40:00
7798
2
原创 html2canvas导出图片缺失
html2canvas导出图片只能导出第一屏,被隐藏的部分不显示;出现的原因:html2canvas是按照当前元素的高度去生成图片的,如果内部的元素高度大于当前父元素的高度,那么就会出现这情况。解决方案:1、父类元素高度调成子元素高度 参考下这个链接子元素div高度不确定时父div高度如何自适应2、官方GitHub上面也有提出过这个问题,有多种解决方案,可以自行试一下。绘制可视区...
2020-01-09 20:00:59
4162
原创 el-menu菜单栏高度超过100%,部分菜单被隐藏
element-ui 中el-menu,很好使用,但是最近出现一种情况:当菜单栏都收缩起来的时候,height 100%是没问题的,但是当菜单栏全部打开,会出现100%不够的感觉,部分菜单被隐藏。怎么解决呢?首先 html ,body的高度都设置下100%;然后左边栏menu的高度menuCon 设置height100%不行,需要改成 calc(100% - 40px) ,其中40px是...
2020-01-08 16:30:30
6399
原创 深拷贝和浅拷贝,按值传递,按址传递
一、深拷贝和浅拷贝js中的两种变量类型,即值类型(数值、布尔值、null、undefined)和引用类型(对象、数组、函数)。深拷贝和浅拷贝只针对引用类型。感觉上浅拷贝就是引用,深拷贝是新建。宗旨就是新生成的对象不改变源数据,不管怎样实现,都可以理解为深拷贝。深拷贝方式一:变成按值传递深拷贝方式二:创建一个新对象 遍历要拷贝的对象属性添加给新对象。二、按值传递按值传递是针对简单类型...
2019-07-08 16:02:27
711
原创 小程序中css实现镜像功能
// css 中定义@mixin flip-horizontal { transform: scale(-1, 1);}// 某个样式模块下引用@include flip-horizontal;希望有用,不用谢。
2019-06-19 17:13:44
872
1
原创 js 判断昨天,前天,去年
// 判断是否是昨天 function isYesterday(time) { const today = wx.getStorageSync('today'); const todayTime = new Date(today).getTime(); // 当天凌晨的时间 const yesterdayTime = new Date(todayT...
2019-05-29 10:53:11
1235
1
原创 小程序canvas绘制自定义分享图片并分享给好友
小程序的分享有自己的机制,在页面点击右上角,或者页面中的button 采用open-type=share方式也可以触发onShareAppMessage方法。文档里面明确说明,分享的图片可以采用网络图片,那么我们自定义图片之后将其保存,得到微信的临时文件路径也是符合要求的。...
2019-05-20 15:26:39
8412
3
转载 小程序生命周期中的一些奇葩问题
最近在做小程序相关的开发工作,对生命周期有一点了解,但是有时候还是会收到测试给出的奇葩问题,这里发现了一个不错的贴子,希望能帮到大家。微信小程序生命周期...
2019-05-10 15:25:23
139
原创 小程序怎么实现左滑操作
左滑最近在开发一个小程序,其中有个需求需要对列表中每项均可实现左滑操作,在查看了官方文档之后,我发现官方的组件movable-view可以实现左滑功能,但是有个缺陷让我很抓狂,就是它需要列表中的每一项的高度都要是固定的,滚屋恩滚~~,我表示下我的无语。怎么办,自己写吧,网上还是有一些例子的,但是有的运行不起来,我这个也是参考了别人的代码写出来的,适用于那种高度不固定,宽度固定的情况。以下例子...
2019-02-13 18:11:31
1640
原创 怎么理解事件流?
作为小白的我,面试总是被问事件流,我虽然没有一脸懵逼,但是也没有说清楚,自己对自己的回复都不满意,何况面试官,回来后我就特别花时间了解了一下,其中的精髓我有点明白了,就是不知道有没有了解到骨髓。啥叫事件?事件其实分为很多种,窗口事件,表单事件,键盘事件,鼠标事件等,窗口事件有比如onbeforeonload,onblur,onfocus,onload,onresize等,表单事件有比如onb...
2018-12-20 17:22:48
522
原创 第一个JS插件——轮播图
开发插件,本人这里采用的是模块化开发方式(Module),确保内存中只有一个对象引用,这样可以节省内存,也可以使代码简洁高效。// 这里采用()()这种自调用函数,形成闭包,内部函数是一个匿名函数,防止插件用户定义函数与插件冲突。(function(){ "use strict"; var _options = { name: '白云', age: '18' }; var ...
2018-12-18 11:00:12
414
原创 js动态添加样式
方式一 var doc = document, link = doc.createElement('link'), head = doc.getElementsByTagName('head')[0]; link.href = path; link.rel = 'stylesheet'; link.type = 'text/css'; head.appendChild(link);...
2018-12-18 10:50:02
1633
原创 JS里面call( )和apply( )以及bind( )方法
call( ) 和 apply( )两个方法总体来说区别不大,都是转换作用域this的指代。具体描述这里查看参考》
2018-11-30 10:21:03
97
原创 移动端怎么加快页面显示速度?
速度:唯快不破做了几年的前端,时间不是很长,感觉很多企业追求最多的就是速度。像武侠片里面说的:唯快不破,“快”给用户带来的体验就会很舒服,试想一下有两个情况,你打开一个页面需要等啊等啊等好久才出来,那你下次还会再进去吗?换我我反正不会再点开,姐没那么有耐心。相反,如果另一个页面分分钟就给你显示出来了,一下子你就能知道这个页面上面有哪些东西,操作起来也很流畅,当然里面的业务是差不多的那种,不包括那...
2018-11-13 15:19:36
897
原创 github开发流程(gitlab)
github上面有仓库stg-wap: 开发步骤: 1、新建文件夹,在文件夹里面,打开Git,执行克隆操作 git clone xxxxx(这里输入分支链接地址,一般在gitlab上面可以直接复制) 2、根据需求创建分支 git checkout -b xxxx 这样会自动切到该新分支下面,然后就可以开发了...
2018-10-25 16:22:13
496
原创 border消失问题
有时候border是1px的宽度,但是用rem转换之后,在app里面显示是有问题的,所以一般border不要用rem来表示,就直接用1px。
2018-09-07 00:20:40
1762
原创 css实现箭头效果
实现箭头的方法有多种,可以直接让UI给一个图标,也可以直接用css样式来实现,以下是直接用样式写的,这里面写的是绝对定位,如不想引起样式错乱则需要用一个div包住。1. 使用css,用两个三角形叠加实现html code: &lt;a href="javascript:;"&gt; &lt;span class="arrow arrow-top arrowDo...
2018-08-20 15:56:30
2207
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人