漆黑菌的博客

也许面向工资编程才是先进生产力的发展方向...

移动端rem适配方案切换vw适配方案

需求背景 目前组内使用的移动端适配方案是基于rem的flexible方案，其他组想要使用任务中心的部分样式代码，但是不确定其他组是否也使用flexible方案。就算用的是flexible方案，也不确定使用的转换单位是否一致，所以就试着用一下和js解耦的vw布局方案。 参考文章 知乎的一篇文章，ts的部分可以先无视掉https://zhuanlan.zhihu.com/p/36913200。...

本文章由 漆黑菌 于 2019年08月30日 发布

移动端混合开发监听页面可见性visibilitychange优化页面数据同步

需求背景 任务中心中，跳转第三方页面完成任务后，因为没有一个机制通知前端已经在第三方页面完成任务，导致任务完成状态无法更新。 领券中心中，现有的预热倒计时需利用前端计时器，当页面被切换到后台或者手机锁屏时计时器会暂停，导致虽然领券时间已经到了但是前端页面还在倒计时。 参考文章 阮一峰老师的文章入门http://www.ruanyifeng.com/blog/2018/10/pa...

本文章由 漆黑菌 于 2019年08月27日 发布

监控曝光度埋点神器IntersectionObserver

需求背景 8月初接到了产品侧的一个需求，希望埋点能够提供活动的曝光情况，正好就想到了IntersectionObserver这个新API。 参考文章 阮一峰老师的文章入门也不错，但是后面缺乏更新和polyfill就不推荐了。 从入门到进阶的用法https://juejin.im/post/5d23fe1551882514bf5bf4c9 一个初步入门的例子，基本能满足需求https:/...

本文章由 漆黑菌 于 2019年08月26日 发布

promise比callback有什么优势的一波总结

参考文章 chrome有一篇介绍promise的文章很不错https://developers.google.com/web/fundamentals/primers/promises?hl=zh-cn 优势 可读性上升，不用像callback写法一样层层嵌套 可以成功/失败事件发生和处理分离，callback+事件监听器写法如果事件已经发生，再监听就不能捕获事件了。而且使用pr...

本文章由 漆黑菌 于 2019年07月29日 发布

记录一波webstorm常用样式设置

webstorm常用样式设置 在插件商店下载material theme和atom-material-icons（新版icons插件被单独拆出）插件 在设置中搜索theme找到material theme选项，选择monokai pro主题，主题颜色为#80CBC4。contrast mode打开，high contrast关闭。 在设置中搜索font找到color schem...

本文章由 漆黑菌 于 2019年07月25日 发布

单行文字超出隐藏配合图标

需求 描述标题文字在一个动态宽度的div中，文字后面要有一个提示用的图标。要求文字长度溢出后，显示省略号…，但是不要影响提示用图标的显示。 原理 利用了inline-block可以多个元素共存于一行，而且可以设置最大宽度的特性，并在文字和整行宽度之间留出图标所需的空余空间即可。 实现方式 CSS3实现：通过max-width使文字宽度动态且不超出，这样图标就可以自然跟在文字后面。利用ca...

本文章由 漆黑菌 于 2019年06月20日 发布

迁移系统到固态硬盘踩坑

准备工具 一个用来准备装PE的U盘，如果要装镜像的话可能需要一个大点的，理论上这个是用不到的。知乎上推荐了一个U盘启动制作软件微PE工具箱下载地址：http://www.wepe.com.cn/download.html，之前U盘装系统有问题似乎就是因为用的第三方U盘启动制作软件自己加了私货。分区工具采用傲梅分区助手官方网站：https://www.disktool.cn/，这个软件在启动U...

本文章由 漆黑菌 于 2019年06月11日 发布

jQuery源码阅读中学到的豆知识

用+号和!号来启动自执行函数 例： +function ($) { 'use strict'; var version = $.fn.jquery.split(' ')[0].split('.') if ((version[0] < 2 && version[1] < 9) || (version[0] == 1 && version[1] == ...

本文章由 漆黑菌 于 2019年06月10日 发布

事情不是你想象的那样

event事件的三种不同“阻止”方法

event事件对象的标准方法 在翻阅MDN研究怎么更改事件触发对象的时候，阅读了一下MDN中有关event事件对象的部分。发现这个对象有三个标准方法，分别是event.preventDefault、event.stopImmediatePropagation、event.stopPropagation。 event.preventDefault preventDefault方法比较熟悉，因...

本文章由 漆黑菌 于 2019年05月23日 发布

一个移动端弹框组件滚动穿透的解决方案

业务场景描述 组内有一个自制的vue弹框组件，就是出一个弹框然后周围都是半透明黑色遮罩的那种。之前的业务场景中弹框中的内容都不需要滚动，因此滚动穿透问题并没有得到重视，然后这个坑我就掉进去了……前人挖坑后人跳坑（确信。组件中原本的解决方案是在组件外层添加一个事件监听，阻止默认的touchmove事件冒泡，这样弹框中需要滚动的部分也不能滚动了，而且好像在iOS上也对穿透到body滚动的问题没啥...

本文章由 漆黑菌 于 2019年05月22日 发布

FEATURED TAGS
helloworld Linux 记录生活 微信 JavaScript tomcat 开机启动 免费CDN VPS nginx 科学使用 网络工程 代理 vue webpack css 面试总结 npm 移动端 docker Windows checkbox vue-cli monaco-editor vue3 vue2 qiankun vue2.6 vue2.7 vue $slots vue $scopedSlots
关于我

人生梦想之一是和叶绿体整合，这样就可以不吃饭了。

✉️ 还没想好用哪个邮箱……

FRIENDS