- 博客(32)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 el-table纵向和横向都有滚动条的时候，右下角会出现白色方块区域
el-table 是饿了么里面的表格，展示数据很方便，但是有一些不知道的样式覆盖的时候比较麻烦，这里总结一些，希望对大家有一点帮助。滚动条的选择器：::-webkit-scrollbar 表格的整个滚动条::-webkit-scrollbar-thumb 表格的滚动条::-webkit-scrollbar-track 页面的滚动条::-webkit-scrollbar-corner 表格...
2020-12-08 14:48:46
3756
2
原创 echarts 实现区域划分 折线图
先给出图表样式这张图看上去是个普通的折线图，但是仔细看又有一些不同，首先它是有区域划分的，不同区域，对应的线条颜色不一样，其次y轴是自定义的，还有各种标记等，总之是有很多构思在里面。echarts图例当中找了很多相似的折线图，但是都不能满足需求，于是动手自己绘制。废话不多说，直接上代码，小伙伴们可以参考下： let dom = document.getElementById("ichart"); dom.style.width = window.innerWidth / 4 + "px";
2020-11-26 14:21:02
3978
原创 正则表达式
元字符：^ 匹配行的开始 $ 匹配尾的结束. 任意字符（除了换行符）[ ] 字符类，匹配方括号中包含的任意字符[^] 否定字符类，匹配方括号中不包含的任意字符* 匹配前面的子表达式零次或多次+ 匹配前面的子表达式一次或多次? 匹配前面子表达式一次或零次，或指明一个非贪婪限定符{n,m} 匹配前面字符最少n次，最多m次(xyz) 按照确切顺序匹配xyz| 分支结构，匹配符号之前的字符或后面的字符。\ 转义字符，还原元字符原来的含义，允许你匹配保留字符 [ ]
2020-08-17 16:41:07
194
原创 前端通信：全双工，半双工，单工
单工：a和b说话，b只能听a说半双工：参考对讲机，A：能不能听到我说话，over B：可以可以，over全双工：参考打电话，A：哎，老王啊！@#！#￥#@！# B：@#￥@￥@￥#@数据通信中，数据在线路上的传送方式可以分为单工通信、半双工通信和全双工通信三种。单工是只能一个方向传递数据。（相当于单向车道，只能按照指定方向走）**半双工（Half Duplex）**是一种传送制式。使用同一根传输线既作接收又作发送，数据可以在两个方向上传送，但通信双方不能同
2020-08-04 11:00:39
351
原创 小程序 计时旋转动效
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
174
原创 vue项目二级域名访问出来是空白页
默认打包出来的项目运行在根目录可以正常显示，如果在二级域名下就会显示空白，是因资源引用路径及路由模式不同导致的。vue.config.js 文件中可以将publicPath这个配置加上：module.exports = { publicPath: process.env.NODE_ENV === 'release' ? './' : '/', devServer: { disableHostCheck: true }, chainWebpack: conf
2020-07-29 15:10:07
893
原创 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
208
原创 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
610
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
3518
原创 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
9326
2
原创 element-UI 文件上传，只允许上传一个文件
elementUI里面文件上传已经写好，挺好用的，不过我今天遇到一个情况，花了我一点时间，所以还是在这里记录一下，也许你也会遇到这种情况，那就刚好可以看看。需求：点击上传一个图片或者PDF文件，只是假上传，在最后提交的时候才真正的上传，并且将上传的文件放到最后提交的接口中，并支持预览，下载，删除功能。官方给了上传头像的例子：// 官方上传头像<el-upload class="avatar-uploader" action="https://jsonplaceholder.typico
2020-05-27 19:26:24
7932
原创 Echarts 双坐标轴的时候 第二个坐标轴总是出不来？
最近一直在使用echarts，整理一下出现的问题，希望可以给刚接触的人一点帮助。Echarts 双坐标轴的时候 第二个坐标轴总是出不来？试试给第一个series添加的yAxisIndex =0 ;第二个series 的yAxisIndex = 1；你会发现“哎哟，出来了”；如果还没出来，再试试给第一个yAxis添加的min max 设置两个值;你又可能会发现“哎哟，出来了”；...
2020-02-20 17:11:14
2253
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
2606
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
7718
2
原创 html2canvas导出图片缺失
html2canvas导出图片只能导出第一屏，被隐藏的部分不显示;出现的原因：html2canvas是按照当前元素的高度去生成图片的，如果内部的元素高度大于当前父元素的高度，那么就会出现这情况。解决方案：1、父类元素高度调成子元素高度 参考下这个链接子元素div高度不确定时父div高度如何自适应2、官方GitHub上面也有提出过这个问题，有多种解决方案，可以自行试一下。绘制可视区...
2020-01-09 20:00:59
4102
原创 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
6281
原创 深拷贝和浅拷贝，按值传递，按址传递
一、深拷贝和浅拷贝js中的两种变量类型，即值类型（数值、布尔值、null、undefined）和引用类型（对象、数组、函数）。深拷贝和浅拷贝只针对引用类型。感觉上浅拷贝就是引用，深拷贝是新建。宗旨就是新生成的对象不改变源数据，不管怎样实现，都可以理解为深拷贝。深拷贝方式一：变成按值传递深拷贝方式二：创建一个新对象 遍历要拷贝的对象属性添加给新对象。二、按值传递按值传递是针对简单类型...
2019-07-08 16:02:27
705
原创 小程序中css实现镜像功能
// css 中定义@mixin flip-horizontal { transform: scale(-1, 1);}// 某个样式模块下引用@include flip-horizontal;希望有用，不用谢。
2019-06-19 17:13:44
857
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
1224
1
原创 小程序canvas绘制自定义分享图片并分享给好友
小程序的分享有自己的机制，在页面点击右上角，或者页面中的button 采用open-type=share方式也可以触发onShareAppMessage方法。文档里面明确说明，分享的图片可以采用网络图片，那么我们自定义图片之后将其保存，得到微信的临时文件路径也是符合要求的。...
2019-05-20 15:26:39
8186
3
转载 小程序生命周期中的一些奇葩问题
最近在做小程序相关的开发工作，对生命周期有一点了解，但是有时候还是会收到测试给出的奇葩问题，这里发现了一个不错的贴子，希望能帮到大家。微信小程序生命周期...
2019-05-10 15:25:23
132
原创 小程序怎么实现左滑操作
左滑最近在开发一个小程序，其中有个需求需要对列表中每项均可实现左滑操作，在查看了官方文档之后，我发现官方的组件movable-view可以实现左滑功能，但是有个缺陷让我很抓狂，就是它需要列表中的每一项的高度都要是固定的，滚屋恩滚~~，我表示下我的无语。怎么办，自己写吧，网上还是有一些例子的，但是有的运行不起来，我这个也是参考了别人的代码写出来的，适用于那种高度不固定，宽度固定的情况。以下例子...
2019-02-13 18:11:31
1596
原创 怎么理解事件流？
作为小白的我，面试总是被问事件流，我虽然没有一脸懵逼，但是也没有说清楚，自己对自己的回复都不满意，何况面试官，回来后我就特别花时间了解了一下，其中的精髓我有点明白了，就是不知道有没有了解到骨髓。啥叫事件？事件其实分为很多种，窗口事件，表单事件，键盘事件，鼠标事件等，窗口事件有比如onbeforeonload，onblur，onfocus，onload，onresize等，表单事件有比如onb...
2018-12-20 17:22:48
510
原创 第一个JS插件——轮播图
开发插件，本人这里采用的是模块化开发方式（Module），确保内存中只有一个对象引用，这样可以节省内存，也可以使代码简洁高效。// 这里采用（）（）这种自调用函数，形成闭包，内部函数是一个匿名函数，防止插件用户定义函数与插件冲突。(function(){ "use strict"; var _options = { name: '白云', age: '18' }; var ...
2018-12-18 11:00:12
403
原创 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
1620
原创 JS里面call( )和apply( )以及bind( )方法
call( ) 和 apply( )两个方法总体来说区别不大，都是转换作用域this的指代。具体描述这里查看参考》
2018-11-30 10:21:03
90
原创 移动端怎么加快页面显示速度？
速度：唯快不破做了几年的前端，时间不是很长，感觉很多企业追求最多的就是速度。像武侠片里面说的：唯快不破，“快”给用户带来的体验就会很舒服，试想一下有两个情况，你打开一个页面需要等啊等啊等好久才出来，那你下次还会再进去吗？换我我反正不会再点开，姐没那么有耐心。相反，如果另一个页面分分钟就给你显示出来了，一下子你就能知道这个页面上面有哪些东西，操作起来也很流畅，当然里面的业务是差不多的那种，不包括那...
2018-11-13 15:19:36
884
原创 github开发流程（gitlab）
github上面有仓库stg-wap： 开发步骤： 1、新建文件夹，在文件夹里面，打开Git，执行克隆操作 git clone xxxxx（这里输入分支链接地址，一般在gitlab上面可以直接复制） 2、根据需求创建分支 git checkout -b xxxx 这样会自动切到该新分支下面，然后就可以开发了...
2018-10-25 16:22:13
479
原创 border消失问题
有时候border是1px的宽度，但是用rem转换之后，在app里面显示是有问题的，所以一般border不要用rem来表示，就直接用1px。
2018-09-07 00:20:40
1739
原创 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
2178
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人