Xuanmo Blog

JavaScript记录鼠标最后一次点击页面

需求 最近做了一个项目，需要在网页中实现类似系统的待机动画那种效果，每隔2分钟页面没有任何操作就播放一个视频，所以需要记录鼠标的最后一次操作。 实现方法 针对这个需要，我的实现方法通过一个倒计时去模拟记录鼠标的最后一次点击，给body加一个onclick事件(或其他的dom节点)，每次点击先清除倒计时，在执行这个倒计时，下边是倒计时部分代码，一共4个参数： 倒数时间：秒 计时期间需要做的事情 计时结束需要做的事情 倒计时的名字 function countDown (during, duringCallback, endCallback, timer) { during = +during;

在Nuxtjs中使用@nuxtjs/axios与vuex的一些心得

前言 由于之前写这个nuxt结合wordpress的主题的时候，自己也算是有点懵逼的状态，写的有点乱，数据管理也是不统一，报错信息也是做得不是很好，刚好花了一天时间重构了一下数据管理这一块的代码，也算是踩了一些nuxt的坑吧。之前是用的axios这个库，这次换nuxt官方封装的一个库了，也就是@nuxtjs/axios这个了，之所以换这个的原因主要是官方推荐，做了封装，能更好的与nuxt结合使用。nuxt-axios文档：https://axios.nuxtjs.org/ 主要遇见的问题 nuxt会为每个请求自动加上loading，但是并不想每个都需要，官方给了一种方法，通过请求配置的prog

使用canvas压缩图片大小

目前的项目都有需要用到前端上传图片做压缩处理，结合canvas的toDataURL可以即可做简单的处理，输出格式为base64，下边做了一个简单的封装 /** * [imageCompress 图片压缩] * @param {[Array]} imgSrc [传入图片地址] * @param {Number} [width=1024] [图片需要压缩的宽度,单位：px] * @param {Number} [quality=1] [图片需要压缩的质量，0~1之间] * @return {[type]} [返回base64 jpeg格式图片] */ export function imageCo

计算浏览器滚动条在各浏览器的宽度

博客有段时间没有更新了，也比较忙，今天遇见一个需要计算浏览器滚动条的功能，之前在element-ui见过一种写法，这里做一下笔记。 原理是通过两个父子关系的div的宽度相减得到一个差值，这个值就是浏览器滚动条的宽度，outerWidth - innerWidth = scrollBarWidth。 const scrollContainer = document.createElement('div'); const scrollContent = document.createElement('div'); scrollContainer.style = 'position:fixed;z-

wordpress给管理员发送邮件的那点事

在主题切换到前后端分离之后，wordpress的所有新评论都不给管理员发送邮件通知了，记得之前好像是有的，看了下文档，终于给弄好了，前提需要安装一下Easy WP SMTP插件，插件的设置使用可查看我的另一篇文章https://www.xuanmo.xin/details/1911，结合add_action钩子即可实现，将以下代码插入到functions.php即可，样式或者需要显示其他内容可自行更改： // 有人评论时通知管理员 function xm_new_comment($comment_id) { $to = get_bloginfo('admin_email'); $comment

2018总结

先扯淡 2018给我的感觉过的比之前快，转眼就到年底了，今年也算入行前端比较重要的一年，主要在技术上有了一个好的提升，这是我最大的收获，前端这几年技术变化很快，自己还有好多东西没学，今年一直过得很压抑，也算比较坎坷的一年。 今年终于拿下了我看了两年的MacBook Pro，从16年发布新款就喜欢，今年不想在等，连吃饭的家伙都不给力怎么干好活呢，果断抛弃我的Air。 技术的提升 2017年到年底之前一直没有学vuejs，都是jQuery一把梭，终于在年底学习了一下vue，并用vue做了我的第一版前后端分离的博客（结合Wordpress Rest Api），也是我对ajax有了一个新的认识，也是我

Vue项目中遇见的一些问题

前言 最近在用vue做微信公众号开发，记录一下在vue项目中所遇见的一些问题，算是遇见的一些小坑。 vue history模式在nginx部署遇见的白屏问题 项目开发完成，部署到线上后页面无法访问，一直处于白屏状态，文件显示不能正常加载，在官网有提到需要改一些配置，我这里是用的nginx，具体配置如下： server { listen 80; server_name xuanmo.xin; root /usr/share/nginx/html; location / { index index.php index.html index.htm; try_files $uri $uri/ /in

魔都-外滩