风行者夜色

摘要： 前言 移动端H5在一个长屏的滚动过程中，一旦涉及到输入的文本框，弹出键盘后，滚动位置经常会发生变化，这个时候需要去捕获移动端键盘弹出前后的事件去做一下记录当前滚动状态并恢复的处理。 实现 由于ios和安卓的键盘弹出时的处理机制其实是不一样的，所以需要针对不用系统做相应的处理。 ios ios主要就是 阅读全文

摘要： 前言 最近的需求是做一个移动端H5的长屏广告页，最后需要在微信分享的时候修改文案以及带上图片，这个实现起来也不是很复杂。 实现步骤 先绑定域名，先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。由于该自定义分享需要借助微信的jssdk来实现，所以这一步是必须的。 引入微信 阅读全文

摘要： 前言 对于某个页面中的某个组件，很多时候需要其保持一直激活的状态，之前我的博客里面有一篇提到一种缓存策略，就是利用Route的children方法来display该组件或隐藏该组件。但是这种方式需要借助到Route组件并且只能缓存整个页面，而不是页面中的部分组件。并且这种缓存单纯的只是在页面上把它的 阅读全文

摘要： 前言 由于工作需要，需要做一版在手机上查看的H5的广告页。广告页面基本都是一块内容占满一屏，然后上滑下滑就翻页，所以需要一个这样的翻页功能。 代码实现 废话不多说，直接上代码 /** * 一个放置多个满屏页面的容器，支持上下滑动 */ // ScrollBox.jsx import React, { 阅读全文

摘要： 前言 基于前面自己手动搭建的React项目，我把项目分成了四种，一种什么都不带的空项目，一种带多级路由的空项目，一种带状态管理的空项目，一种带多级路由以及状态管理的空项目。这样的话每次用的时候根据需要去获取自己想要的模板，但是往往还要去github上去拷贝，感觉很不方便，所以就想到了要做一个自动生成 阅读全文

摘要： 场景 昨天试了一下爬取根据网页查询参数的不同而变化的页面，今天来试试爬取单页面应用，url不发生变化，只是页面内的按钮点击导致数据的重新请求。 主要实现思路 利用Puppeteer可以模拟用户点击操作，等待接口返回等各种优秀的API，可以保证在数据结束后完成页面数据提取。 代码实现，以开源众包的页面 阅读全文

摘要： 场景 很多长图大图需要裁剪成多张小图 用到的npm包 jimp，用于Node的图像处理库，完全使用JavaScript编写，零本地依赖项。 代码实现 const Jimp = require('jimp'); /** * url 目标图片，需要裁减的图片 * files 裁剪过后的文件路径，根据文件 阅读全文

摘要： Puppeteer简单介绍 Puppeteer 是 Chrome 开发团队在 2017 年发布的一个 Node.js 包,用来模拟 Chrome 浏览器的运行。 它的功能： 网页截图或者生成 PDF 爬取 SPA 或 SSR 网站 UI 自动化测试，模拟表单提交，键盘输入，点击等行为 捕获网站的时间 阅读全文

摘要： 起因 偶然间看了一下Angular的服务的依赖注入和rxjs的观察者流的使用，觉得还有点意思，就想在React中实现一下类似的。 准备工作 一个空的React项目。 安装rxjs，npm install rxjs --save; 实现思路 首先是根据业务需求，将需要抽离的全局状态使用不同的服务类进行 阅读全文

摘要： 添加redux拢共分几步？ 拢共分四步 新建action 新建reducer 新建store 使用provider包裹 新建action 通常来说，action需要返回一个通用的格式的数据，可以根据自己业务体量的不同，定义不同的数据结构，我这边是这样定义的 // 同步的action const te 阅读全文